
/*.intro-header {
background: linear-gradient(180deg, #41228e, #41228e, #613583);
}*/

.intro-header {
	background: linear-gradient(-180deg, #41228e, #613583, #23a6d5, #613583), #41228e;
	background-size: 400% 400%;
	animation: gradient 15s ease infinite alternate-reverse;
}

.intro-header.big-img {
	padding: 0;
	margin: 0;
}

.spacefiller {
	width: 100%;
	height: 90px;
	padding-top: 0.625rem;
	padding-bottom: 0.625rem;
}

.border-5 {
	border-width: 5px;
}

#contact {
	background-image: url('../img/map-image.png');
	background-color: #03022b;
	background-size: cover;
	background-position: center;
	padding: 1rem 0;
}

#contact #message {
	height: 174px;
}

.img-circle {
	width: 200px;
	display: block;
	margin: 0 auto;
}

@keyframes gradient {
	0% {
		background-position: 50% 0%;
	}
	50% {
		background-position: 50% 50%;
	}
	100% {
		background-position: 50% 100%;
	}
}
.home-nav .navbar {
	background: none;
}

header .text {
	position: absolute;
	left: 10%;
	top: 0;
	width: 50%;
}

header .image {
	position: absolute;
	right: 10%;
	top: 75px;
	width: 40%;
	height: 375px;
}

.navbar-custom.top-nav-short, .navbar-custom.top-nav-short-permanent {
	background-color: rgba(0,0,0,0.60);
}

.intro-header .image img {
	position: absolute;
	width: 65%;
	left: 25%;
	bottom: 75px;
}

.boxes {
	/*position: absolute;
	top: 400px;
	width: 100%;
	z-index: 20;*/
}

.boxes .row {
	max-width: 1210px;
	margin: 0 auto;
}
.card {
	transition: all 1s;
	cursor: pointer;
}

.card:hover {
	border-color: #9357eb !important;
}

.boxes .card {
	background-color: #f2f5fa;
}

.boxes img {
	width: 80px;
}

.col .card {
	transition: 1s;
	background-position: center;
	background-size: 100%;
}
.col .card:hover {
	background-size: 120%;
}
.mainimage {
	max-width: 400px;
	margin: 0 auto;
	display: block;
}
.rdivider {
	position: absolute;
	width: 115%;
	height: 200px;
	background-color: #fff;
	bottom: -90px;
	border-radius: 100%;
	left: -7.5%;
	z-index: 10;
}
.cloud {
	background: white;
	top: 50px;
	border-radius: 100%;
	position: absolute;
}

.cloud.first {
	top: 220px;
	animation: cloud1 2.25s ease infinite alternate;
	width: 120px;
	height: 100px;
}
.cloud.second {
	top: 195px;
	left: 70px;
	width: 140px;
	height: 100px;
	animation: cloud2 1.75s ease infinite alternate;
}
.cloud.third {
	top: 155px;
	left: 140px;
	width: 140px;
	height: 140px;
	animation: cloud3 1.85s ease infinite alternate;
}

.cloud.fourth {
	top: 90px;
	left: 160px;
	width: 120px;
	height: 95px;
	animation: cloud4 1.6s ease infinite alternate;
}

.cloud.fifth {
	top: 115px;
	left: 285px;
	width: 175px;
	height: 140px;
	animation: cloud5 1.9s ease infinite alternate;
}

footer li {
	list-style: none;
	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

#contact input, #contact textarea {
	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.cloud.sixth {
	top: 195px;
	left: 380px;
	width: 160px;
	height: 120px;
	animation: cloud6 2.1s ease infinite alternate;
}

header h2 i {
	font-size: 44px;
	font-weight: 100;
	font-style: normal;
	color: lightgreen;
}

@keyframes cloud1 {0% {left: 0px} 100% {left: 10px}}
@keyframes cloud2 {0% {top: 195px} 100% {top: 185px}}
@keyframes cloud3 {0% {left: 140px} 100% {left: 130px}}
@keyframes cloud4 {0% {top: 90px} 100% {top: 100px}}
@keyframes cloud5 {0% {left: 285px} 100% {left: 275px}}
@keyframes cloud6 {0% {top: 195px} 100% {top: 205px}}

@media screen and (max-width: 1200px) {
	header .image {
		width: 50%;
		right: 0;
		top: 110px;
	}
	header .text {
		width: 60%;
		left: 0;
	}
	.intro-header .image img {
		bottom: 50px;
	}
}

@media screen and (max-width: 1000px) {
	.cloud {
		display: none;
	}
}

@media screen and (max-width: 750px) {
	header .image {
		width: 80%;
		display; block;
		position: relative;
		margin: 0 auto;
	}
	header .text {
		width: 80%;
		display; block;
		position: relative;
		margin: 0 auto;
	}
	.intro-header .image img {
		position: relative;
		left: auto;
		width: auto;
		max-width: 300px;
		margin: 0 auto;
		display: block;
	}
	.rdivider {
		display: none;
	}
	header .image img {
		position: relative;
	}

}
