@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Mukta:wght@300&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300&display=swap');

:root{
	--image:"https://www.aigtechnologies.in/images/slides/web-development.jpg";
	--image2:"https://previews.123rf.com/images/pellinni/pellinni1712/pellinni171200095/91334426-grassy-field-in-front-of-a-forested-hills-lovely-nature-scenery-in-springtime-mountains.jpg";
	--image3: "https://cdn.pixabay.com/photo/2017/10/10/07/48/hills-2836301_960_720.jpg";
	--image4: "https://cdn.pixabay.com/photo/2021/08/04/13/06/software-developer-6521720__480.jpg";
	--image5: "https://cdn.pixabay.com/photo/2019/03/18/06/46/cyber-4062449_960_720.jpg";
	--primary: rgba(0,123,255,1);
	--secondary: #000;
}
.primary{
	color:var(--primary);
}
.secondary{
	color:var(--secondary);
}
*{
	box-sizing:border-box;
	margin:0;
	padding:0;
} 

html{
    width:100vw;
	scroll-behavior:smooth;
}
h2{
     font-family: 'Mukta', sans-serif;
}

.call{
	width:65px;
	height: 65px;
	text-align:center;
	border-radius:50%;
	position:fixed;
	top:43%;
	left:15px;
	z-index:999999999;
	font-size:45px;
	text-shadow: -2px 2px 5px black;
	box-shadow: -2px 2px 5px black;
	animation: heart .30s infinite alternate;
	cursor:pointer;
	
}

.call a{
	color:#1ce11c;	
	outline:0;
}

.background{
	//background-image: linear-gradient(rgba(0,123,255,1),rgba(0,123,255,1));
	background:var(--primary);
	background-size:cover;
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-attachment:fixed;
	box-shadow:-2px 2px 15px black;
	border-bottom: 20px solid black;
	border-radius: 99% 1% 100% 0% / 0% 54% 46% 100%;
}

.navbar{
	background:rgba(255,255,255,1);
	position:fixed;
	top:0;
	left:0;
	width:100%;
	transition: all ease .5s;
	z-index:1000;
	line-height:30px;
	padding-bottom:0;
	box-shadow:-.5px .5px 10px black;
	border-radius:100% 0% 76% 24% / 0% 100% 0% 100% ;
	//border-radius:100% 0% 100% 0% / 0% 73% 27% 100% ;
}
#menubar .navbar-nav li a{
	//color:#007bff;
	color:#000;
	font-size:18px;
	font-weight:500;
}
#menubar .navbar-nav li a:hover{
	color: var(--primary);
}

.business_logo{
	width:90px;
	margin-right:10px;
}
.navbar-brand{
	    font-size:52px;
        font-family: 'Oswald', sans-serif;
        animation: hearts .30s infinite alternate;
}

.navbar .fullform{
	font-size:16px;
}

@keyframes heart{
	to{
		transform: scale(1.1);
	}
}


.landing{
	padding:100px 50px;
	color:#007bff;
}

.landing h2{
	font-size: 50px;
	color: #fff;
	//text-shadow: -2px 2px 10px black;
}
.landing h1{
	font-size:70px;
	color:#fff;
	background:rgba(0,0,0,0);
	//font-family: 'Mukta', sans-serif;
	font-family: 'Oswald', sans-serif;
	text-shadow: -10px -10px 30px black;
}

.landing div div img{
	width:90%;
	box-shadow:-2px 2px 15px black;
	border-radius:81% 19% 80% 20% / 16% 90% 10% 84% ;
}

.tagline:after{
	content:"";
	
}


.offers img{
	width:50%;
    cursor:pointer;
}

@keyframes startup{
	from{
		right:-100%;
	}
	to{
		right:0%;
	}	
}

@keyframes change{
	to{
		border-radius:16% 90% 10% 84% / 81% 19% 80% 20% ;
	}
}

.about_us{
	height:79vh;
	border-bottom:10px solid var(--primary);
	//box-shadow:2px 2px 15px 5px var(--secondary);
	border-radius:70px;
}
.about_us div a,i{
	font-size:25px;
}
.about_us div div img{
    width:100%;
}

#services{
	background:var(--primary);
	height:79vh;
}
#services div{
	
}

.services > h2{
	text-transform:uppercase;
	font-size:43px;
}
#services .heading{
	text-transform:uppercase;
	font-size:43px;
	color:#fff;
}

.services .service{
	box-shadow:-2px 2px 5px black;
	padding:15px;
	margin:10px;
	position:relative;
	transition:all ease .5s;
	cursor:pointer;
	border-radius:5px;
	background:#fff;
}
.services .service i{
	font-size:90px;
	color:var(--primary);
}

.services .service:hover{
	transform:scale(1.1);
}

.services .service:after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:10%;
	height:100%;
	transition:all ease .5s;
	z-index:-1;
	border-radius:5px;
	background:var(--priamry);
}

.services .service:hover *{
	//color:white;
}
.services .service:hover:after{
	width:100%;
	//background:var(--primary);
}
.services .service h2{
	font-size:30px;
}

#service_info{
	width:50%;
	height:50%;
	position:fixed;
	top:25%;
	left:25%;
	background:#fff;
	color:pink;
	z-index:999999;
	visibility:hidden;
	border-radius: 5px;
	box-shadow: -2px 2px 5px black;
}


.ourteam{
	padding:10px;
		border-top:10px solid var(--primary);
	box-shadow:-2px 2px 15px var(--secondary);
	border-radius:5px;
}


.ourteam div div{
	 cursor:pointer;
}
.ourteam > h2{
	margin:auto;
	text-transform:uppercase;
	font-size:43px;
	position:relative;
}


.ourteam div div{
	transition: all ease .5s;
}
.ourteam div div:hover{
	transform: scale(1.05);
}

.member_info{
	width:50%;
	height:50%;
	position:fixed;
	top:25%;
	left:25%;
	color:black;
	background:white;
	border-radius:3px;
	box-shadow: -2px 2px 5px black;
	z-index:100000;
	visibility:hidden;
	transition: all ease .5s;
	transform: scale(100%);
	overflow:auto !important;
}

.member_info div div{
	word-wrap:break-word;
}

.member_info div .designation h3{
	font-size:20px;
}

.member_info .img img{
	width:90%;
	margin-left:5%;
}


.member_info .img i{
	font-size:140px;
	color:#007bff;
}
.member_info div .name{
	font-size:21px;
	color:black;
}


.member_info #member_lines{
	font-size:12px;
	text-align:justify;
}

.member_info #vision{
	font-size:12px;
	text-align:justify;
	color:green;
	font-weight: bold;
}

.service_info div div h3{
	color:red;
}
	
.service_info div div p{
	font-size:12px;
	color:black;
}

.service_info div div .contacts{
	font-size:16px;
	color:red;
}

.service_info div div ul{
	list-style:none;
	font-size:12px;
}

#info_back{
	width:100%;
	height:100%;
	background: rgba(0,0,0,.7);
	position:fixed;
	top:0;
	left:0;
	visibility:hidden;
	transition: all ease .5s;
	z-index:99999;
}

.info_hide{
	font-size:20px;
	color:red;
	width:30px;
	text-align:center;
}
.info_hide:hover{
	color:white;
	background:red;
}


.contact{
	border-top:10px solid var(--primary);
	box-shadow:-2px 2px 15px var(--secondary);
}
.contact div form div div{
	display:flex;
	flex-direction:column;
}
.contact div div input,textarea{
	border:1px solid #007bff;
	border-radius:3px;
	color:#007bff;
}

.contact label{
	margin-top:5px;
	margin-bottom:0;
	color:#007bff;
	font-weight:bold;
}
.contact form div div input{
	padding:2px;
	margin:0;
}

.contact div div textarea{
	width:100%;
	min-height:120px;
	max-height:120px;
}

.contact div div button{
	margin: 5px 0;
}


*:focus{
	outline: 2px solid blue;	
}
.bottom{
	height:auto;
}

.bottom .brand h2{
	font-size:60px;
}

.bottom .brand p{
	color:yellow;
	font-size:25px;
	animation: hearts .3s infinite alternate;
}

.bottom div div ul{
	list-style:none;
}

.bottom div a{
	color:white;
	text-decoration:none;
}

.copyright{
	z-index:100;
}

.up_arrow{
	position:fixed;
	bottom:5px;
	right:5px;
	width:50px;
	height:50px;
	display:none;
	transition:all ease .5s;
	text-align:center;
	background:#ffff;
	border-radius:50%;
}
.up_arrow i{
	font-size:50px;
}

@media (max-width:600px){
	.business_logo{
		width:50px;
	}
	.navbar-brand{
		font-size:43px;
	}
	
	.landing{
		padding-top:120px;
	}
	.landing h2{
	font-size: 45px;
	color: white;
	text-shadow: -2px 2px 10px black;
    }
    .landing h1{
	font-size:60px;
	}
	
	.about_us{
	height:100%;
	}
	
	#services{
	height:100%;
	}
	.services >h2{
	text-transform:uppercase;
	font-size:34px;
	}
	
	.ourteam > h2{
	font-size:34px;
	}
	
	
	.member_info div .col-md-5 h3{
	font-size:16px;
    }
.offers img{
	width:100%;
}

}

@media (max-width:1200px){
    
    .bottom .brand h2{
	    font-size:45px;
    }
    
}