html{
	background-color: rgba(0,77,255,0.2);
}
.icon {
	color: #666; 
	font-size: 24px; 
}
.icon:hover {
	color: #008000; 
}#project{
		
	border-radius: 10px ;
	font-size:20px
}
#ada{
	display:flex;
	
}#imgt{
	display:flex;
}
html {
scroll-behavior: smooth;
}
#project-container {
display: flex; 
align-items: center; 
justify-content: center; 
width: 100%; 
overflow: hidden;
}

#project {
position: relative; 
padding: 0 10px; 
}

#project::before, #project::after {
content: ''; 
position: absolute; 
top: 50%; 
width: 100vw; 
height: 1px; 
background: black; 
}

#project::before {
right: 100%; 
}

#project::after {
left: 100%; 
}.spinner {
width: 44px;
height: 44px;
animation: spinner-y0fdc1 2s infinite ease;
transform-style: preserve-3d;
}

.spinner > div {
background-color: rgba(0,77,255,0.2);
height: 100%;
position: absolute;
width: 100%;
border: 2px solid #004dff;
}

.spinner div:nth-of-type(1) {
transform: translateZ(-22px) rotateY(180deg);
}

.spinner div:nth-of-type(2) {
transform: rotateY(-270deg) translateX(50%);
transform-origin: top right;
}

.spinner div:nth-of-type(3) {
transform: rotateY(270deg) translateX(-50%);
transform-origin: center left;
}

.spinner div:nth-of-type(4) {
transform: rotateX(90deg) translateY(-50%);
transform-origin: top center;
}

.spinner div:nth-of-type(5) {
transform: rotateX(-90deg) translateY(50%);
transform-origin: bottom center;
}

.spinner div:nth-of-type(6) {
transform: translateZ(22px);
}

@keyframes spinner-y0fdc1 {
0% {
transform: rotate(45deg) rotateX(-25deg) rotateY(25deg);
}

50% {
transform: rotate(45deg) rotateX(-385deg) rotateY(25deg);
}

100% {
transform: rotate(45deg) rotateX(-385deg) rotateY(385deg);
}
}

#continter{
	display: flex;
	gap:4%;
	justify-content:space-around;
}#items{
	display:flex;
	background-color: rgba(96, 7, 205, 0.716);
	height: 45px;
	width: 165px;
	border-radius: 15px ;
	justify-content:center;

	color: white;
	align-items: center;
	transition: background-color 0.7s;

	flex-wrap:wrap;
	
	

}
html{
	background-color: rgba(17, 26, 37, 0.947);
}
#sgs{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sgs4{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sgsma{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sgs0{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sgs01{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sgsm{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

font-size:18px;
color:white;

}#sorento{
	position: absolute;
	right:10px;
}
#secondsection{
	display: flex;
flex-direction: column;
align-items: center;
height: 1200px;
width: 100%;
background-color: rgba(17, 26, 37, 0.947);
}#secondsectiong{
	display: flex;
flex-direction: column;
align-items: center;
height: 1200px;
width: 100%;
background-color: rgba(17, 26, 37, 0.947);
}#secondsection2{
	display: flex;
flex-direction: column;
align-items: center;
height: 1200px;
width: 100%;
background-color: rgba(17, 26, 37, 0.947);
}#items:hover{
	background-color: rgba(50, 0, 112, 0.895);

}#secondsss{
	border-radius: 30%;
	background: rgb(0, 149, 109);
	justify-content:right;
	align-items: right;
	height: 200px;
	width: 50%;
	margin-left: auto;
	
}#seconds{
	display: flex;
	position: absolute;
	right: 0; 
	margin-left:50px ;
	margin-top:370px ;

	border-radius: 10px ;
	background: rgb(248, 252, 0);
	justify-content:right;
	align-items: right;
	height: 20px;
	width: 50%;
	margin-left: auto;
	 
	transform: rotate(-45deg);
	transition: background-color 0.7s;

}#seconds2{
	display: flex;
	position: absolute;
	left: 0; 
	margin-right:50px ;
	margin-top:370px ;

	border-radius: 10px ;
	background: rgb(248, 252, 0);

	height: 20px;
	width: 50%;
	margin-right: auto;
	 
	transform: rotate(45deg);
	transition: background-color 0.7s;

}#seconds2:hover{

	background-color: rgb(252, 0, 0);
}#seconds:hover{

	background-color: rgb(252, 0, 0);
}#ee, #seld {
margin: 0; 
 
display: flex;
justify-content: center;
width: 100%;
}#ee{
margin-top: 2.4%;
color:white;
font-size:30px;
}#seld{
font-size:90px;
color:rgb(252, 0, 0);
}

#aimg {
width: 400px;
height: 400px;
display: block;
margin: 0 auto; 
}#se{
align-self: flex-start;
margin-left: 6%;
width: 300px;
height: auto;
border-radius: 35px;

}#selec{
display: flex;

width: 100%; 

}#sg{

position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;

}#col{
position: absolute;
font-size:28px;
right:10px;
color:rgb(248, 252, 0);
}#newcol{
position: absolute;
font-size:28px;
right:10px;
color:rgb(248, 252, 0);
}
#col2{
position: absolute;
font-size:18px;
right:10px;
margin-top: 60px ;

}#col2a{
position: absolute;
font-size:18px;
right:10px;
margin-top: 60px ;

}#col3{
position: absolute;
font-size:18px;
right:10px;
margin-top: 90px ;


}#col3a{
position: absolute;
font-size:18px;
right:10px;
margin-top: 90px ;


}#cola{
position: absolute;
font-size:28px;
right:10px;
color:rgb(248, 252, 0);


}#thrd{
width: 100%;
height: 900px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#thrdb{
width: 100%;
height: 900px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#thrde4d{
width: 100%;
height: 900px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#sea{
display:flex;
height: 500px;
width: 500px;
margin-top: 120px;
margin-left: 110px;
}#seee{
display:flex;
margin-left: 6%;
width: 300px;
height: 640px;
border-radius: 35px;

}#seeep{
display:flex;
margin-left: 3%;
width: 300px;
height: 640px;
border-radius: 35px;

}#ht{
display:flex;
margin-top:90px ;
}#am{
border-bottom: rgb(248, 252, 0) solid 1px;
width: 80%;
background-color:rgba(17, 26, 37, 0.947);
}#sga{
position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;

right:0;
}#sgaf{
position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;

right:0;
}#sgaf{
position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: #ff154477;
right:0;
}#sgaa {
position: absolute;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 175px;
width: 400px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 550px;
right: 250px;
}#sgaaz {
position: absolute;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 175px;
width: 400px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 550px;
right: 250px;
}#sgaal {
position: absolute;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 175px;
width: 400px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 550px;
right: 250px;
}#sgaax {
position: absolute;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 175px;
width: 400px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 550px;
right: 250px;
}
#col4{
position: absolute;
font-size:18px;
right:10px;
margin-top: 120px ;


}#col5{
position: absolute;
font-size:18px;
right:10px;
margin-top: 150px ;


}
#col6{
position: absolute;
font-size:18px;
right:10px;
margin-top: 180px ;


}#col7{
position: absolute;
font-size:18px;
right:10px;
margin-top: 210px ;


}#col8{
position: absolute;
font-size:18px;
right:10px;
margin-top: 240px ;


}#col9{
position: absolute;
font-size:18px;
right:10px;
margin-top: 270px ;


}#col10{
position: absolute;
font-size:18px;
right:10px;
margin-top: 300px ;


}#col11{
position: absolute;
font-size:18px;
right:10px;
margin-top: 330px ;


}#col12{
position: absolute;
font-size:18px;
right:10px;
margin-top: 360px ;


}#col13{
position: absolute;
font-size:18px;
right:10px;
margin-top: 390px ;


}#col14{
position: absolute;
font-size:18px;
right:10px;
margin-top: 410px ;


}#thrdd{
width: 100%;
height: 700px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#thrddk{
width: 100%;
height: 700px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#thrddx{
width: 100%;
height: 700px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;
}#ame{
margin-right:20px ;
margin-top:5px ;
}@media (max-width: 732px) {

.deep{
display: none;

}
}#sea2{
	display:flex;
	height: 500px;
	width: 800px;
	margin-top: 140px;
	margin-left: 110px;
	border-radius:10px
	
}#seee2{
	display:flex;
    margin-left: 6%;
    width: 800px;
    height: 500px;
    border-radius: 35px;
	
}#website{
	font-size:90px;
	color:rgb(252, 0, 0);
}#toolsai{
	font-size:90px;
	color:rgb(252, 0, 0);
}#desktop{
	font-size:90px;
	color:rgb(252, 0, 0);
}#seeepa{
	display:flex;
    margin-left: 3%;
    width: 700px;
    height: 500px;
    border-radius: 35px;
	
}#footer{
	width: 100%;
	background-color: black;
	color:gold;
	
}@media (max-width: 732px) {


}@media (max-width: 832px) {

	#items{
		width: 250px;
		margin: 6px;
		
	

}#continter{
	flex-direction:column;
	justify-content:center;
	align-items: center;
	
	
	
	

}#secondsection{
	display: flex;
	
	flex-direction: column;

}#selec{
	display: flex;
	flex-wrap:wrap;
	flex-direction: row;
	justify-content:center;
	align-items:center;
	padding: 30px;
}#ht{
	display: flex;
	flex-wrap:wrap;
}#sea{
	display: flex;
	justify-content:center;
	align-items:center;
	margin:0;
	margin-top: 150px;
}#spls{
	display: flex;
	flex-wrap:wrap;
}#seld{
	font-size:50px;
}#sg{
	display: none;
}#col2a{
	color:white;
	
}#col3a{
	color:white;
	
}#thrd{
	margin-top: 500px;
	display: flex;
	flex-wrap:wrap;
	justify-content: center;
}#delet{
	display: none;
}.meg{
	margin-top: 430px;
}#sgaa{
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 200px;
width: 300px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 1820px;
right: 5px;
}#sgaax{
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 200px;
width: 300px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 920px;
right: 5px;
font-size:13px;
}#thrdd{
	display: flex;
	flex-wrap:wrap;
	margin-top:1200px ;
	justify-content: center;
}#thrddx{
	display: flex;
	flex-wrap:wrap;
	margin-top:300px ;
	justify-content: center;
}#secondsection2{
	margin-top: 1900px;
}#sea2{
	margin:0 ;
	
	height: 200px;
}#seconds2{
	display: none;
}#seconds{
	display: none;
}#sgs{
	margin-top: 640px;
	width: 370px;

}#thrde4d{
	margin-top: 120px;
}#sgaf{
	display: none;
}#ht{
	justify-content: center;
}#seee2 {
display: flex;
margin:0;
width: 400px;
height: 300px;
border-radius: 18px;
}#sgsm{
margin-top: 340px;
width: 370px;

}#seeep{
display:flex;
justify-content: center;

width: 300px;
height: 640px;
border-radius: 35px;

}#seeepa{
display:flex;
margin: 0;
width: 400px;
height: 300px;
border-radius: 35px;

}#thrddk{
width: 100%;
height: 700px;
background-color: red;
background-color: rgba(17, 26, 37, 0.947);
display: flex;

flex-wrap: wrap;
margin:0 ;
justify-content: center;

}#website {
font-size: 50px;
color: rgb(252, 0, 0);
}#toolsai {
font-size: 50px;
color: rgb(252, 0, 0);
}.dark{
background-color: rgba(0,77,255,0.2);
}#sgs0{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: rgba(0,77,255,0.2);
right:0;

font-size:18px;
color:white;
margin-top: 700px;
}#sgs00{
	position: absolute;
border-top-left-radius: 90px;
border-bottom-left-radius: 90px;
text-align: right;
height: 400px;
width: 400px;
background-color: rgba(0,77,255,0.2);
right:0;

font-size:18px;
color:white;
margin-top: 200px;
}#secondsectiong{
	margin-top:590px ;
}#sgs01{
	margin-top:340px ;
	background-color:rgba(0,77,255,0.2); ;
}#sgaal {
position: absolute;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
border-top-right-radius: 90px;
border-bottom-right-radius: 90px;
text-align: right;
height: 175px;
width: 400px;
background-color: white; 
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1); 
margin-top: 850px;
right: 20px;
}#desktop {
font-size: 50px;
color: rgb(252, 0, 0);
}#thrdb{
margin-top: 340px;
}#sgsma{
margin-top: 340px;
width: 370px;
}#sgaaz{
display: none;
}#footer{
margin-top:300px ;
}#sgs4{

margin:0 ;
}



}#ame{
	color:black;
	
}