.homepage {
	width: 100%;
	height: 100%;
}

.homepage .a-block {
	position: relative;
	width: 100%;
	height: 50%;
	background-image: url('/content/homepage/images/data-center.jpg');
	background-repeat: no-repeat;
	background-size: cover;
}

.homepage .a-block .slogan {
	position: absolute;
	padding: 1em;
	font-size: 1.25em;
	text-align: center;
	vertical-align: middle;
	letter-spacing: 0.2em;
	background-color: rgba(255,0,0,0.75);
	color: white;
}

.homepage .b-block {
	margin: 2em 0 5em 0;
	vertical-align: top;
}

.homepage .b-block .title {
	margin-bottom: 1em;
	font-size: 2em;
	font-weight: bold;
	text-align: center;
}

.homepage .b-block .item {
	display: block;
	padding: 1em;
	margin: 1em auto 0 auto;
	background-color: white;
}

.homepage .b-block .item-table {
	display: table;
}

.homepage .b-block .icon {
	display: table-cell;
	width: 25%;
	padding: 0.25em;
	text-align: center;
	font-size: 5em;
	color: red;
}

.homepage .b-block .text {
	display: table-cell;
	padding: 0.25em;
	font-size: 1.5em;
	vertical-align: middle;
}

.homepage .c-block {
	position: relative;
	width: 100%;
	height: 50%;
	background-image: url('/content/homepage/images/cyber-security.jpg');
	background-repeat: no-repeat;
	background-size: cover;
}

.homepage .c-block .item {
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	letter-spacing: 0.2em;
	background-color: rgba(0,0,0,0.5);
	color: white;
}

.homepage .z-block {
	margin: 2em 0 5em 0;
	vertical-align: top;
}

.homepage .z-block .title {
	margin-bottom: 1em;
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
}

.homepage .z-block .contact-form form {
	margin: 0 auto 2em auto;
	text-align: center;
}

.homepage .z-block .contact-form form label {
	position: relative;
	display: block;
	width: 100%;
	margin: 0 auto 0 auto;
}

.homepage .z-block .contact-form form label input, .homepage .z-block .contact-form form label textarea, .homepage .z-block .contact-form form label select {
	margin: 0.5em 0.5em 0.5em 0;
	padding: 0.5em;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.homepage .z-block .contact-form form .g-recaptcha div {
	width: 100%;
	margin: 2em auto 0 auto;
}

.homepage .z-block .contact-form form textarea {
	min-height: 15em;
}

.homepage .z-block .contact-form form button {
	margin-top: 1em;
	font-size: 1.75em;
}

/* Responsive */

@media (min-width: 0) and (max-width: 800px) {
	.homepage .a-block, .homepage .c-block {
		background-attachment: scroll;
	}
	.homepage .b-block .item {
		width: 95%;
	}
	.homepage .c-block .item {
		padding: 5%;
		font-size: 1em;
	}
	.homepage .z-block .contact-form form label input, .homepage .z-block .contact-form form label textarea, .homepage .z-block .contact-form form label select {
		width: 75%;
	}
}

@media (min-width: 801px) and (max-width: 1400px) {
	.homepage .a-block, .homepage .c-block {
		background-attachment: fixed;
	}
	.homepage .b-block .item {
		width: 70%;
	}
	.homepage .c-block .item {
		padding: 5%;
		font-size: 1.5em;
	}
	.homepage .z-block .contact-form form label input, .homepage .z-block .contact-form form label textarea, .homepage .z-block .contact-form form label select {
		width: 35%;
	}
}

@media (min-width: 1401px) {
	.homepage .a-block, .homepage .c-block {
		background-attachment: fixed;
	}
	.homepage .a-block .slogan {
		left: 1em;
		top: 1em;
	}
	.homepage .c-block .item {
		padding: 5% 25% 0 25%;
		font-size: 1.6em;
	}
	.homepage .b-block .item {
		width: 50%;
	}
	.homepage .z-block .contact-form form label input, .homepage .z-block .contact-form form label textarea, .homepage .z-block .contact-form form label select {
		width: 25%;
	}
}
