@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
*{
	margin: 0;
	padding: 0;
	outline: none;
	box-sizing: border-box;
	font-family: 'Poppins', sans-serif;
}
body {
	width: 100%;
	height: 100%;
	/* background: -webkit-repeating-linear-gradient(-45deg, #71b7e6, #69a6ce, #b98acc, #ee8176, #b98acc, #69a6ce, #9b59b6); */
	/* background-size: 400%; */
	/* background-image: url('../img/bg.jpg'); */
}
textarea {
	max-width: 85%;
	font-size: 16px;
	color: grey;
	border:1px dashed #006cbe;
}
.effect {
	animation: fadeIn 5s;
}
@keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
#center {
	position: absolute;
	top: 10%;
	left: 15%;
	right: 15%;
	bottom: 10%;
	display: flex;
	align-items: center;
	justify-content: center;
}
#wrap {
	position: fixed;
	width: inherit;
	height: inherit;
	background-image: url('../img/bg.jpg');	
}
#formURL {
	margin-top: 65px;	
}
#container {
	position: absolute;
	top: 10%;
	left: 15%;
	right: 15%;
	bottom: 10%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0px 5px 10px rgba(0,0,0,0.1);
}
#container .content {
	max-width: 100%;
	text-align: center;
}
.content h2.header {
	font-size: 60px;
	line-height: 1em;
	position: relative;
}
.content h2.header:after {
	position: absolute;
	content: attr(data-text);
	top: 0;
	left: 0;
	right: 0;
	background: -webkit-repeating-linear-gradient(-45deg, #006cbe, #0095e9, #012b67, #0095e9, #006cbe, #012b67);
	background-size: 250%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-shadow: 1px 1px 2px rgba(255,255,255,0.25);
	animation: animate 7s ease-in-out infinite;
}
@keyframes animate {
	0%{
		background-position: 0 0;
	}
	25%{
		background-position: 100% 0;
	}
	50%{
		background-position: 100% 100%;
	}
	75%{
		background-position: 0% 100%;
	}
	100%{
		background-position: 0% 0%;
	}
}
.content h4 {
	font-size: 1.5em;
	margin-bottom: 20px;
	text-transform: uppercase;
	font-size: 2em;
	position: relative;
	color: #708090;		
}
.content h4:after {
	position: absolute;
	content: attr(data-text);
	top: 0;
	left: 0;
	right: 0;
	text-shadow: 1px 1px 2px rgba(255,255,255,0.4);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.content p {
	margin: 20px 20px;
	color: grey;
}
.content .btn {
	font-size: 20px;
	margin: 25px 0;
	display: inline-flex;
}
input[type=submit] {
	display: inline-block;
	text-decoration: none;
	border: 2px solid #3284b9;
	color: #3284b9;
	font-weight: 500;
	padding: 10px 25px;
	border-radius: 25px;
	text-transform: uppercase;
	transition: all 0.3s ease;
	background-color: #fff;
}
input[type=submit]:hover {
	background: #3284b9;
	color: #fff;
}
button {
	display: inline-block;
	text-decoration: none;
	border: 2px solid #3284b9;
	color: #3284b9;
	font-weight: 500;
	padding: 10px 25px;
	border-radius: 25px;
	text-transform: uppercase;
	transition: all 0.3s ease;
	background-color: #fff;
}
button:hover {
	background: #3284b9;
	color: #fff;
}
.content .btn a {
	display: inline-block;
	text-decoration: none;
	border: 2px solid #69a6ce;
	color: #69a6ce;
	font-weight: 500;
	padding: 10px 25px;
	border-radius: 25px;
	text-transform: uppercase;
	transition: all 0.3s ease;
	margin-top: 50px;
}
.content .btn a:hover {
	background: #69a6ce;
	color: #fff;
}
.pulseBox {
	-webkit-animation-name: pulseBox;
	-moz-animation-name: pulseBox;
	-o-animation-name: pulseBox;
	animation-name: pulseBox;
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	-o-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-iteration-count: infinite;
	-o-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	-moz-animation-direction: alternate;
	-o-animation-direction: alternate;
	animation-direction: alternate;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	-o-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	border: 0px;
	margin-top: 25px;
	/* font-size: 16px; */
	/* font-family: 'Montserrat', sans-serif; */
	color: #fff;
	text-align: center;
}
@-webkit-keyframes pulseBox {
	0% {-webkit-box-shadow: 0px 0px 10px 0px rgba(105, 166, 206, 0.6);}
	100% {-webkit-box-shadow: 0px 0px 18px 0px rgba(105, 166, 206, 0.9);}
}
@-moz-keyframes pulseBox {
	0% {-moz-box-shadow: 0px 0px 10px 0px rgba(105, 166, 206, 0.6);}
	100% {-moz-box-shadow: 0px 0px 18px 0px rgba(105, 166, 206, 0.9);}
}
@-o-keyframes pulseBox {
	0% {-o-box-shadow: 0px 0px 10px 0px rgba(105, 166, 206, 0.6);}
	100% {-o-box-shadow: 0px 0px 18px 0px rgba(105, 166, 206, 0.9);}
}
@keyframes pulseBox {
	0% {box-shadow: 0px 0px 10px 0px rgba(105, 166, 206, 0.6);}
	100% {box-shadow: 0px 0px 18px 0px rgba(105, 166, 206, 0.9);}
}
@media screen and (max-width: 999px) {
	
	.content p {
		font-size: 40px;
	}
	.content h2.header{
		font-size: 100px;		
	}	
	.content h4 {
		margin: 50px;
		font-size: 55px;
	}
	textarea {
		font-size: 28px;
	}
	input[type=submit] {
		padding: 20px 40px !important;
		margin-top: 70px !important;
		font-size: 45px !important;
		border-radius: 50px !important;
	}
	button {
		padding: 20px 40px !important;
		margin-top: 70px !important;
		font-size: 45px !important;
		border-radius: 50px !important;
	}
	#container {
		top: 15%;
		bottom: 15%;
		left: 8%;
		right: 8%;
	}
}
