/*-------------------------------------------------Home Page css*------------------------------------------------------------------------------------/

body{
			font-family: 'Fira Sans', sans-serif;
			margin: 0;
			font-size: 20px;
		}
		h1{
			font-size: 50px;
			font-weight: 600;
			margin: 0;
		}
		.content{
			padding: 100px;
		}
/*		header{
		background: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.6)),url(others/img/header.jpg);
			background-repeat: no-repeat;
			background-position: center center;
			-webkit-background-size: cover;
			background-size: cover;
			width: 100%;
			height: 100vh;
			display: -webkit-flex;
			display: -moz-flex;
			display: -ms-flex;
			display: -o-flex;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-flow: column;
			text-align: center;
			color: #fff;


		}*/

#particles-js{
	background: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.6)),url(../img/header.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	background-size: cover;
	width: 100%;
	height: 100vh;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-flow: column;
	text-align: center;
	color: #fff;
}

#header-title{
	position: absolute;
}
/*.second-container{
	text-align: center;
}*/
/*.container{
	background-color: #060c21;
}*/
#box-img{
	position: relative;
	margin-top: -20px;
	margin-left: -30px;
	width: 300px;
}
#home-box{
	/*box-shadow: -2px 0px 5px 0.1px red; */
	align-items: center;

}
#home-box:hover{
		box-shadow: -2px 5px 10px 5px #566bff;
		transition-duration: 1s;
}
#home-box:hover #box-img{
	width: 350px;
	transition-duration: 1s;

}
#second-container-title{
	color: #1360ef;
	margin-top: 20px;

}
/*.box-img{
	margin: 20px;
	padding: 50px;
	width: 250px;
}*/
#second-container-col{
	margin: 10px;
	box-shadow: -2px 1px 10px #ccc;
	margin-top: 70px;
}
#second-container-col img{
	width: 200px;
	margin-top: -50px;
}
#second-container-col h3{
	color: #696969;
	top: 180px;
}
.card-content{
	text-align: justify;
}
#ceopng{
	width: 200px;
}
.third-container-row{
	background: radial-gradient(#7cc0fa, #056ac0);
}
#fifth-container{
	margin-top: 30px;
	text-align: center;
	height: 100vh;
}
.card-body{
	height: 50vh;
	margin-top: -20vh;
	position: relative;
	z-index: -1;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;

}
#connect-form-box{
	height: 50vh;
	width: 50vw;
	background-color: #fff;
	position: absolute;
	bottom:0vh;
	display: flex;
	justify-content: center center;
	border-radius: 10px;
	box-shadow: 1px 0px 9px 0px #000000;
	z-index: 0;
}
#contact-color-bg{
	/*background-color: #056ac0;*/
	background: linear-gradient(-45deg, #3da2ff, #0654c3, #66aaff, #2d6bf5);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
	height: 50vh;
	margin: 0px;
	/*background-image: url('../img/contact-round.png');
	background-repeat: no-repeat;*/
	position: relative;
	z-index: -1;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	/*align-items: center;*/
	/*flex-flow: column;*/
	/*text-align: center;*/


}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
#contact-color-bg p{
	position: absolute;
	color: #fff;
	font-size: 40px;
	font-weight: bold;
	z-index: 3;

}
#contact-round-img{
	margin: 0px;
	position: absolute;
	left: 0px;
	top: 0px;
	height: 50vh;
	opacity: 0.7;
	z-index: 2;
}
#contact-tech-img{
	position: absolute;
	margin: 0px;
	right: 0px;
	height: 50vh;
	opacity: 0.1;
	z-index: 1;
}

#cristmas{
	height: 20vh;
	background: radial-gradient(#ff0606, #c00505);
	justify-content: center;
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	align-items: center;
	margin-top:30px; 
	position: relative;
	z-index: -2;
	animation: cristmasBackMove 2s ease infinite;
}
@keyframes cristmasBackMove{
	from{background:radial-gradient(#ff0606, #c00505);}
	to{background:radial-gradient(#0663ff, #0548c0);}
	/*0% {
		background:radial-gradient(#ff0606, #c00505);
	}
	50% {
		background:radial-gradient(#0663ff, #0548c0);
	}
	100% {
		background:radial-gradient(#ff0606, #c00505);
	}*/


}
#cristmas-header{
	color: #fff;
	font-size: 50px;
	font-weight: bold;
	text-align: center;
	line-height: 75px;
	z-index: 1;
}
#deco1{
	height: 20vh;
	left: -20px;
	top: -20px;
	position: absolute;
}
#deco2{
	position: absolute;
	height: 20vh;
	right: 0;
	top: 0px;
}
#contact-details{
	margin-top: 100px;
}
#contact-details-address{
	text-align: left;
	text-overflow: left;
	color: #fff;

}
#contact-details-address b{
	font-size: 20px;
}
#contact-details-numbers{
	text-align: left;
	text-overflow: left;
	color: #fff; 

}
#contact-details-numbers b{
	font-size: 20px;
}
#contact-details-ico-phone{
	width: 20px;
	margin-top: -10px;
	padding: 0px;
}
#contact-details-ico{
	width: 30px;
	margin: 8px;
}
#contact-details-ico-social{
	width: 60px;
	margin: 10px;
}
#contact-details-ico-div{
	margin-top: 30px;
}
}
.map-responsive{
	margin: 0px;
	padding: 0px;

}
#footer-logo{
	width: 150px;
	padding: 0px;
}
#ceo-img{
	width: 100%; 
	margin-top:-100px;
	margin-left: -20px;
	margin-bottom: 0px;
	-webkit-filter: grayscale(20%);  Safari 6.0 - 9.0 
  	filter: grayscale(20%);
  	animation: ceoImgAnimation 5s infinite;
}

@media screen and (max-width: 1000px){
	#ceo-img{
		width: 70vw; 
		margin-top:-100px; 
		-webkit-filter: grayscale(20%); /* Safari 6.0 - 9.0 */
  		filter: grayscale(20%);
  		animation: ceoImgAnimation 5s infinite;
	}
}


/*-----------------------------------------------------------------codes in laptop---------------------------------------------*/*/

#membres{
	height: 80vh;
}
#members-title{
	margin-top: 5vh;
	font-weight: bold;
	color: #1474c6;
}
.members-box{
	height: 40vh;
	margin-left: 10px;
	margin-right: 10px;
	margin-top: 50px;
	width: 500px;
	box-shadow: 1px 0px 9px 0px #000000;
	/*background-color: #5f48dd;*/
	background: linear-gradient(60deg,#5f48dd, #5f48dd);

}
@media screen and (max-width: 570px){
	.members-box{
		margin-top: 50px;
		margin-left: 10px;
	}
}

#lakshan{
	width: 200px;
	position: absolute;
	margin: 0px;
	bottom: 0px;
	left: 0px;
	filter: grayscale(100%);
}
#dev{
	width: 180px;
	margin-top: 20px;
	position: absolute;
	bottom: 0px;
	filter: grayscale(100%);

}#harsha{
	width: 200px;
	margin: 0px;
	position: absolute;
	right: 0px;
	bottom: 0px;
	filter: grayscale(100%);
}
#lakshan-name{
	position: absolute;
	right: 10px;
	top: 10vh;
	color: #fff;
}
#dev-name{
	position: absolute;
	right: 20px;
	top: 10vh;
	color: #fff;
}
#harsha-name{
	position: absolute;
	left: 10px;
	top: 10vh;
	color: #fff;
}
#member-rank{
	margin-top: -10px;
	color: #fff;
	font-weight: bold;
}
/*#member-rank2{
	position: absolute;
	right: 20px;
	top: 10vh;
	color: #414141;
}
#member-rank3{
	position: absolute;
	left: 10px;
	top: 10vh;
	color: #414141;
}*/
/*#navBrand{
	font-size: 25px;
	font-style: bold;
	padding: 5px;
}
.navbar{
	font-size: 25px;
	color: #fff;
	width: 100vw;
	position: fixed;
	background: rgba(0,0,0,0.5);
	padding: 10px;

}