html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;}

body {
	padding: 0;
    margin: 0;
    font-family: "Dosis",Helvetica,Arial,sans-serif;
    letter-spacing: .5px;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    color: #000;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow: hidden;
	-webkit-user-select: none;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

body {
	-webkit-text-size-adjust: none;
}

mark {
	background-color: transparent;
	color: inherit;
}

input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input, select, textarea {
	-moz-appearance: none;
	-webkit-appearance: none;
	-ms-appearance: none;
	appearance: none;
}

/* Basic */

	@-ms-viewport {
		width: device-width;
	}

	body {
		-ms-overflow-style: scrollbar;
	}

	@media screen and (max-width: 480px) {

		html, body {
			min-width: 320px;
		}

	}
	html {
	    background: #041b25;
	}

	html {
		box-sizing: border-box;
	}
	* {
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
	}
	*, *:before, *:after {
		box-sizing: inherit;
	}

	html {
		overflow-x: hidden;
	}

	body {
		background: -webkit-gradient(linear, left bottom, right top, from(#01262f), to(#020815)) fixed;
	}

		body.is-preload *, body.is-preload *:before, body.is-preload *:after {
			-moz-animation: none !important;
			-webkit-animation: none !important;
			-ms-animation: none !important;
			animation: none !important;
			-moz-transition: none !important;
			-webkit-transition: none !important;
			-ms-transition: none !important;
			transition: none !important;
		}
		body a {
			color: transparent;
		}

/* Typography */

	html {
		font-size: 18pt;
	}

		@media screen and (max-width: 1920px) {

			html {
				font-size: 13pt;
			}

		}

		@media screen and (max-width: 1152px) {

			html {
				font-size: 14pt;
			}

		}

		@media screen and (max-width: 736px) {

			html {
				font-size: 12pt;
			}

		}

		@media screen and (max-width: 480px) {

			html {
				font-size: 11pt;
			}

		}

	body {
		/*background-color: #01303c;*/
		color: #000000;
	}

	body, input, select, textarea {
		color: #000000;
		letter-spacing: 0.0375em;
		line-height: 2;
	}

	a {
		-moz-transition: border-bottom-color 0.25s ease-in-out;
		-webkit-transition: border-bottom-color 0.25s ease-in-out;
		-ms-transition: border-bottom-color 0.25s ease-in-out;
		transition: border-bottom-color 0.25s ease-in-out;
		text-decoration: none;
		color: #000000;
		border-bottom: dotted 1px;
	}

		a:hover {
			text-decoration: none;
			border-bottom-color: transparent;
		}

	strong, b {
		color: #000000;
	}

	em, i {
		font-style: italic;
	}

	p {
		margin: 0 0 2rem 0;
	}

	h1, h2, h3, h4, h5, h6 {
		color: #000000;
		letter-spacing: 0.175em;
		line-height: 1.75;
		margin: 0 0 1.5rem 0;
		text-transform: uppercase;
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
			color: inherit;
			text-decoration: none;
		}

	h1 {
		letter-spacing: -0.05em;
		line-height: 1.1;
		margin: 0 0 1.5rem 0;
		text-transform: none;
	}

	h2 {
		font-size: 1.25rem;
		margin: 0 0 2rem 0;
	}

	h3 {
		font-size: 0.875rem;
	}

	h4 {
		font-size: 0.875rem;
	}

	h5 {
		font-size: 0.75rem;
	}

	h6 {
		font-size: 0.625rem;
	}

	@media screen and (max-width: 736px) {

		h1 {
			font-size: 4.5rem;
			line-height: 1.1;
		}

		h2 {
			font-size: 1.25rem;
			line-height: 1.7;
		}

		h3 {
			font-size: 0.9rem;
		}

		h4 {
			font-size: 0.75rem;
		}

		h5 {
			font-size: 0.675rem;
		}

	}

	@media screen and (max-width: 360px) {

		h1 {
			font-size: 3.75rem;
		}

		h2 {
			font-size: 1.125rem;
		}

		h3 {
			font-size: 0.8rem;
		}

		h4 {
			font-size: 0.675rem;
		}

		h5 {
			font-size: 0.675rem;
		}

	}

	sub {
		font-size: 0.8rem;
		position: relative;
		top: 0.5rem;
	}

	sup {
		font-size: 0.8rem;
		position: relative;
		top: -0.5rem;
	}

	blockquote {
		border-left: solid 0.5rem rgba(144, 144, 144, 0.25);
		font-style: italic;
		margin: 0 0 2rem 0;
		padding: 1rem 0 1rem 2rem;
	}

	code {
		background: rgba(144, 144, 144, 0.1);
		border-radius: 0.325rem;
		font-family: "Courier New", monospace;
		font-size: 0.9rem;
		margin: 0 0.25rem;
		padding: 0.25rem 0.65rem;
	}

	pre {
		-webkit-overflow-scrolling: touch;
		font-family: "Courier New", monospace;
		font-size: 0.9rem;
		margin: 0 0 2rem 0;
		width: 100%;
	}

		pre code {
			display: block;
			line-height: 1.75;
			padding: 1rem 1.5rem;
			overflow-x: auto;
		}

	hr {
		border: 0;
		border-bottom: solid 2px rgba(144, 144, 144, 0.25);
		margin: 3rem 0;
	}

		hr.major {
			margin: 5rem 0;
		}

		@media screen and (max-width: 736px) {

			hr.major {
				margin: 3rem 0;
			}

		}

/* Row */

	.row {
		display: flex;
		flex-wrap: wrap;
		box-sizing: border-box;
		align-items: stretch;
	}

		.row > * {
			box-sizing: border-box;
		}

		.row.gtr-uniform > * > :last-child {
			margin-bottom: 0;
		}

		.row.aln-left {
			justify-content: flex-start;
		}

		.row.aln-center {
			justify-content: center;
		}

		.row.aln-right {
			justify-content: flex-end;
		}

		.row.aln-top {
			align-items: flex-start;
		}

		.row.aln-middle {
			align-items: center;
		}

		.row.aln-bottom {
			align-items: flex-end;
		}

		.row > .imp {
			order: -1;
		}

		.row > .col-1 {
			width: 8.33333%;
		}

		.row > .off-1 {
			margin-left: 8.33333%;
		}

		.row > .col-2 {
			width: 16.66667%;
		}

		.row > .off-2 {
			margin-left: 16.66667%;
		}

		.row > .col-3 {
			width: 25%;
		}

		.row > .off-3 {
			margin-left: 25%;
		}

		.row > .col-4 {
			width: 33.33333%;
		}

		.row > .off-4 {
			margin-left: 33.33333%;
		}

		.row > .col-5 {
			width: 41.66667%;
		}

		.row > .off-5 {
			margin-left: 41.66667%;
		}

		.row > .col-6 {
			width: 50%;
		}

		.row > .off-6 {
			margin-left: 50%;
		}

		.row > .col-7 {
			width: 58.33333%;
		}

		.row > .off-7 {
			margin-left: 58.33333%;
		}

		.row > .col-8 {
			width: 66.66667%;
		}

		.row > .off-8 {
			margin-left: 66.66667%;
		}

		.row > .col-9 {
			width: 75%;
		}

		.row > .off-9 {
			margin-left: 75%;
		}

		.row > .col-10 {
			width: 83.33333%;
		}

		.row > .off-10 {
			margin-left: 83.33333%;
		}

		.row > .col-11 {
			width: 91.66667%;
		}

		.row > .off-11 {
			margin-left: 91.66667%;
		}

		.row > .col-12 {
			width: 100%;
		}

		.row > .off-12 {
			margin-left: 100%;
		}

		.row.gtr-0 {
			margin-top: 0;
			margin-left: 0rem;
		}

			.row.gtr-0 > * {
				padding: 0 0 0 0rem;
			}

			.row.gtr-0.gtr-uniform {
				margin-top: 0rem;
			}

				.row.gtr-0.gtr-uniform > * {
					padding-top: 0rem;
				}

		.row.gtr-25 {
			margin-top: 0;
			margin-left: -0.5rem;
		}

			.row.gtr-25 > * {
				padding: 0 0 0 0.5rem;
			}

			.row.gtr-25.gtr-uniform {
				margin-top: -0.5rem;
			}

				.row.gtr-25.gtr-uniform > * {
					padding-top: 0.5rem;
				}

		.row.gtr-50 {
			margin-top: 0;
			margin-left: -1rem;
		}

			.row.gtr-50 > * {
				padding: 0 0 0 1rem;
			}

			.row.gtr-50.gtr-uniform {
				margin-top: -1rem;
			}

				.row.gtr-50.gtr-uniform > * {
					padding-top: 1rem;
				}

		.row {
			margin-top: 0;
			margin-left: -2rem;
		}

			.row > * {
				padding: 0 0 0 2rem;
			}

			.row.gtr-uniform {
				margin-top: -2rem;
			}

				.row.gtr-uniform > * {
					padding-top: 2rem;
				}

		.row.gtr-150 {
			margin-top: 0;
			margin-left: -3rem;
		}

			.row.gtr-150 > * {
				padding: 0 0 0 3rem;
			}

			.row.gtr-150.gtr-uniform {
				margin-top: -3rem;
			}

				.row.gtr-150.gtr-uniform > * {
					padding-top: 3rem;
				}

		.row.gtr-200 {
			margin-top: 0;
			margin-left: -4rem;
		}

			.row.gtr-200 > * {
				padding: 0 0 0 4rem;
			}

			.row.gtr-200.gtr-uniform {
				margin-top: -4rem;
			}

				.row.gtr-200.gtr-uniform > * {
					padding-top: 4rem;
				}

		@media screen and (max-width: 1920px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-xlarge {
					order: -1;
				}

				.row > .col-1-xlarge {
					width: 8.33333%;
				}

				.row > .off-1-xlarge {
					margin-left: 8.33333%;
				}

				.row > .col-2-xlarge {
					width: 16.66667%;
				}

				.row > .off-2-xlarge {
					margin-left: 16.66667%;
				}

				.row > .col-3-xlarge {
					width: 25%;
				}

				.row > .off-3-xlarge {
					margin-left: 25%;
				}

				.row > .col-4-xlarge {
					width: 33.33333%;
				}

				.row > .off-4-xlarge {
					margin-left: 33.33333%;
				}

				.row > .col-5-xlarge {
					width: 41.66667%;
				}

				.row > .off-5-xlarge {
					margin-left: 41.66667%;
				}

				.row > .col-6-xlarge {
					width: 50%;
				}

				.row > .off-6-xlarge {
					margin-left: 50%;
				}

				.row > .col-7-xlarge {
					width: 58.33333%;
				}

				.row > .off-7-xlarge {
					margin-left: 58.33333%;
				}

				.row > .col-8-xlarge {
					width: 66.66667%;
				}

				.row > .off-8-xlarge {
					margin-left: 66.66667%;
				}

				.row > .col-9-xlarge {
					width: 75%;
				}

				.row > .off-9-xlarge {
					margin-left: 75%;
				}

				.row > .col-10-xlarge {
					width: 83.33333%;
				}

				.row > .off-10-xlarge {
					margin-left: 83.33333%;
				}

				.row > .col-11-xlarge {
					width: 91.66667%;
				}

				.row > .off-11-xlarge {
					margin-left: 91.66667%;
				}

				.row > .col-12-xlarge {
					width: 100%;
				}

				.row > .off-12-xlarge {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0;
					margin-left: 0rem;
				}

					.row.gtr-0 > * {
						padding: 0 0 0 0rem;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0rem;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0rem;
						}

				.row.gtr-25 {
					margin-top: 0;
					margin-left: -0.5rem;
				}

					.row.gtr-25 > * {
						padding: 0 0 0 0.5rem;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -0.5rem;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 0.5rem;
						}

				.row.gtr-50 {
					margin-top: 0;
					margin-left: -1rem;
				}

					.row.gtr-50 > * {
						padding: 0 0 0 1rem;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -1rem;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 1rem;
						}

				.row {
					margin-top: 0;
					margin-left: -2rem;
				}

					.row > * {
						padding: 0 0 0 2rem;
					}

					.row.gtr-uniform {
						margin-top: -2rem;
					}

						.row.gtr-uniform > * {
							padding-top: 2rem;
						}

				.row.gtr-150 {
					margin-top: 0;
					margin-left: -3rem;
				}

					.row.gtr-150 > * {
						padding: 0 0 0 3rem;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -3rem;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 3rem;
						}

				.row.gtr-200 {
					margin-top: 0;
					margin-left: -4rem;
				}

					.row.gtr-200 > * {
						padding: 0 0 0 4rem;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -4rem;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 4rem;
						}

		}

		@media screen and (max-width: 1280px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-large {
					order: -1;
				}

				.row > .col-1-large {
					width: 8.33333%;
				}

				.row > .off-1-large {
					margin-left: 8.33333%;
				}

				.row > .col-2-large {
					width: 16.66667%;
				}

				.row > .off-2-large {
					margin-left: 16.66667%;
				}

				.row > .col-3-large {
					width: 25%;
				}

				.row > .off-3-large {
					margin-left: 25%;
				}

				.row > .col-4-large {
					width: 33.33333%;
				}

				.row > .off-4-large {
					margin-left: 33.33333%;
				}

				.row > .col-5-large {
					width: 41.66667%;
				}

				.row > .off-5-large {
					margin-left: 41.66667%;
				}

				.row > .col-6-large {
					width: 50%;
				}

				.row > .off-6-large {
					margin-left: 50%;
				}

				.row > .col-7-large {
					width: 58.33333%;
				}

				.row > .off-7-large {
					margin-left: 58.33333%;
				}

				.row > .col-8-large {
					width: 66.66667%;
				}

				.row > .off-8-large {
					margin-left: 66.66667%;
				}

				.row > .col-9-large {
					width: 75%;
				}

				.row > .off-9-large {
					margin-left: 75%;
				}

				.row > .col-10-large {
					width: 83.33333%;
				}

				.row > .off-10-large {
					margin-left: 83.33333%;
				}

				.row > .col-11-large {
					width: 91.66667%;
				}

				.row > .off-11-large {
					margin-left: 91.66667%;
				}

				.row > .col-12-large {
					width: 100%;
				}

				.row > .off-12-large {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0;
					margin-left: 0rem;
				}

					.row.gtr-0 > * {
						padding: 0 0 0 0rem;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0rem;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0rem;
						}

				.row.gtr-25 {
					margin-top: 0;
					margin-left: -0.375rem;
				}

					.row.gtr-25 > * {
						padding: 0 0 0 0.375rem;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -0.375rem;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 0.375rem;
						}

				.row.gtr-50 {
					margin-top: 0;
					margin-left: -0.75rem;
				}

					.row.gtr-50 > * {
						padding: 0 0 0 0.75rem;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -0.75rem;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 0.75rem;
						}

				.row {
					margin-top: 0;
					margin-left: -1.5rem;
				}

					.row > * {
						padding: 0 0 0 1.5rem;
					}

					.row.gtr-uniform {
						margin-top: -1.5rem;
					}

						.row.gtr-uniform > * {
							padding-top: 1.5rem;
						}

				.row.gtr-150 {
					margin-top: 0;
					margin-left: -2.25rem;
				}

					.row.gtr-150 > * {
						padding: 0 0 0 2.25rem;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -2.25rem;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 2.25rem;
						}

				.row.gtr-200 {
					margin-top: 0;
					margin-left: -3rem;
				}

					.row.gtr-200 > * {
						padding: 0 0 0 3rem;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -3rem;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 3rem;
						}

		}

		@media screen and (max-width: 1152px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-medium {
					order: -1;
				}

				.row > .col-1-medium {
					width: 8.33333%;
				}

				.row > .off-1-medium {
					margin-left: 8.33333%;
				}

				.row > .col-2-medium {
					width: 16.66667%;
				}

				.row > .off-2-medium {
					margin-left: 16.66667%;
				}

				.row > .col-3-medium {
					width: 25%;
				}

				.row > .off-3-medium {
					margin-left: 25%;
				}

				.row > .col-4-medium {
					width: 33.33333%;
				}

				.row > .off-4-medium {
					margin-left: 33.33333%;
				}

				.row > .col-5-medium {
					width: 41.66667%;
				}

				.row > .off-5-medium {
					margin-left: 41.66667%;
				}

				.row > .col-6-medium {
					width: 50%;
				}

				.row > .off-6-medium {
					margin-left: 50%;
				}

				.row > .col-7-medium {
					width: 58.33333%;
				}

				.row > .off-7-medium {
					margin-left: 58.33333%;
				}

				.row > .col-8-medium {
					width: 66.66667%;
				}

				.row > .off-8-medium {
					margin-left: 66.66667%;
				}

				.row > .col-9-medium {
					width: 75%;
				}

				.row > .off-9-medium {
					margin-left: 75%;
				}

				.row > .col-10-medium {
					width: 83.33333%;
				}

				.row > .off-10-medium {
					margin-left: 83.33333%;
				}

				.row > .col-11-medium {
					width: 91.66667%;
				}

				.row > .off-11-medium {
					margin-left: 91.66667%;
				}

				.row > .col-12-medium {
					width: 100%;
				}

				.row > .off-12-medium {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0;
					margin-left: 0rem;
				}

					.row.gtr-0 > * {
						padding: 0 0 0 0rem;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0rem;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0rem;
						}

				.row.gtr-25 {
					margin-top: 0;
					margin-left: -0.375rem;
				}

					.row.gtr-25 > * {
						padding: 0 0 0 0.375rem;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -0.375rem;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 0.375rem;
						}

				.row.gtr-50 {
					margin-top: 0;
					margin-left: -0.75rem;
				}

					.row.gtr-50 > * {
						padding: 0 0 0 0.75rem;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -0.75rem;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 0.75rem;
						}

				.row {
					margin-top: 0;
					margin-left: -1.5rem;
				}

					.row > * {
						padding: 0 0 0 1.5rem;
					}

					.row.gtr-uniform {
						margin-top: -1.5rem;
					}

						.row.gtr-uniform > * {
							padding-top: 1.5rem;
						}

				.row.gtr-150 {
					margin-top: 0;
					margin-left: -2.25rem;
				}

					.row.gtr-150 > * {
						padding: 0 0 0 2.25rem;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -2.25rem;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 2.25rem;
						}

				.row.gtr-200 {
					margin-top: 0;
					margin-left: -3rem;
				}

					.row.gtr-200 > * {
						padding: 0 0 0 3rem;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -3rem;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 3rem;
						}

		}

		@media screen and (max-width: 736px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-small {
					order: -1;
				}

				.row > .col-1-small {
					width: 8.33333%;
				}

				.row > .off-1-small {
					margin-left: 8.33333%;
				}

				.row > .col-2-small {
					width: 16.66667%;
				}

				.row > .off-2-small {
					margin-left: 16.66667%;
				}

				.row > .col-3-small {
					width: 25%;
				}

				.row > .off-3-small {
					margin-left: 25%;
				}

				.row > .col-4-small {
					width: 33.33333%;
				}

				.row > .off-4-small {
					margin-left: 33.33333%;
				}

				.row > .col-5-small {
					width: 41.66667%;
				}

				.row > .off-5-small {
					margin-left: 41.66667%;
				}

				.row > .col-6-small {
					width: 50%;
				}

				.row > .off-6-small {
					margin-left: 50%;
				}

				.row > .col-7-small {
					width: 58.33333%;
				}

				.row > .off-7-small {
					margin-left: 58.33333%;
				}

				.row > .col-8-small {
					width: 66.66667%;
				}

				.row > .off-8-small {
					margin-left: 66.66667%;
				}

				.row > .col-9-small {
					width: 75%;
				}

				.row > .off-9-small {
					margin-left: 75%;
				}

				.row > .col-10-small {
					width: 83.33333%;
				}

				.row > .off-10-small {
					margin-left: 83.33333%;
				}

				.row > .col-11-small {
					width: 91.66667%;
				}

				.row > .off-11-small {
					margin-left: 91.66667%;
				}

				.row > .col-12-small {
					width: 100%;
				}

				.row > .off-12-small {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0;
					margin-left: 0rem;
				}

					.row.gtr-0 > * {
						padding: 0 0 0 0rem;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0rem;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0rem;
						}

				.row.gtr-25 {
					margin-top: 0;
					margin-left: -0.3125rem;
				}

					.row.gtr-25 > * {
						padding: 0 0 0 0.3125rem;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -0.3125rem;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 0.3125rem;
						}

				.row.gtr-50 {
					margin-top: 0;
					margin-left: -0.625rem;
				}

					.row.gtr-50 > * {
						padding: 0 0 0 0.625rem;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -0.625rem;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 0.625rem;
						}

				.row {
					margin-top: 0;
					margin-left: -1.25rem;
				}

					.row > * {
						padding: 0 0 0 1.25rem;
					}

					.row.gtr-uniform {
						margin-top: -1.25rem;
					}

						.row.gtr-uniform > * {
							padding-top: 1.25rem;
						}

				.row.gtr-150 {
					margin-top: 0;
					margin-left: -1.875rem;
				}

					.row.gtr-150 > * {
						padding: 0 0 0 1.875rem;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -1.875rem;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 1.875rem;
						}

				.row.gtr-200 {
					margin-top: 0;
					margin-left: -2.5rem;
				}

					.row.gtr-200 > * {
						padding: 0 0 0 2.5rem;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -2.5rem;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 2.5rem;
						}

		}

		@media screen and (max-width: 480px) {

			.row {
				display: flex;
				flex-wrap: wrap;
				box-sizing: border-box;
				align-items: stretch;
			}

				.row > * {
					box-sizing: border-box;
				}

				.row.gtr-uniform > * > :last-child {
					margin-bottom: 0;
				}

				.row.aln-left {
					justify-content: flex-start;
				}

				.row.aln-center {
					justify-content: center;
				}

				.row.aln-right {
					justify-content: flex-end;
				}

				.row.aln-top {
					align-items: flex-start;
				}

				.row.aln-middle {
					align-items: center;
				}

				.row.aln-bottom {
					align-items: flex-end;
				}

				.row > .imp-xsmall {
					order: -1;
				}

				.row > .col-1-xsmall {
					width: 8.33333%;
				}

				.row > .off-1-xsmall {
					margin-left: 8.33333%;
				}

				.row > .col-2-xsmall {
					width: 16.66667%;
				}

				.row > .off-2-xsmall {
					margin-left: 16.66667%;
				}

				.row > .col-3-xsmall {
					width: 25%;
				}

				.row > .off-3-xsmall {
					margin-left: 25%;
				}

				.row > .col-4-xsmall {
					width: 33.33333%;
				}

				.row > .off-4-xsmall {
					margin-left: 33.33333%;
				}

				.row > .col-5-xsmall {
					width: 41.66667%;
				}

				.row > .off-5-xsmall {
					margin-left: 41.66667%;
				}

				.row > .col-6-xsmall {
					width: 50%;
				}

				.row > .off-6-xsmall {
					margin-left: 50%;
				}

				.row > .col-7-xsmall {
					width: 58.33333%;
				}

				.row > .off-7-xsmall {
					margin-left: 58.33333%;
				}

				.row > .col-8-xsmall {
					width: 66.66667%;
				}

				.row > .off-8-xsmall {
					margin-left: 66.66667%;
				}

				.row > .col-9-xsmall {
					width: 75%;
				}

				.row > .off-9-xsmall {
					margin-left: 75%;
				}

				.row > .col-10-xsmall {
					width: 83.33333%;
				}

				.row > .off-10-xsmall {
					margin-left: 83.33333%;
				}

				.row > .col-11-xsmall {
					width: 91.66667%;
				}

				.row > .off-11-xsmall {
					margin-left: 91.66667%;
				}

				.row > .col-12-xsmall {
					width: 100%;
				}

				.row > .off-12-xsmall {
					margin-left: 100%;
				}

				.row.gtr-0 {
					margin-top: 0;
					margin-left: 0rem;
				}

					.row.gtr-0 > * {
						padding: 0 0 0 0rem;
					}

					.row.gtr-0.gtr-uniform {
						margin-top: 0rem;
					}

						.row.gtr-0.gtr-uniform > * {
							padding-top: 0rem;
						}

				.row.gtr-25 {
					margin-top: 0;
					margin-left: -0.3125rem;
				}

					.row.gtr-25 > * {
						padding: 0 0 0 0.3125rem;
					}

					.row.gtr-25.gtr-uniform {
						margin-top: -0.3125rem;
					}

						.row.gtr-25.gtr-uniform > * {
							padding-top: 0.3125rem;
						}

				.row.gtr-50 {
					margin-top: 0;
					margin-left: -0.625rem;
				}

					.row.gtr-50 > * {
						padding: 0 0 0 0.625rem;
					}

					.row.gtr-50.gtr-uniform {
						margin-top: -0.625rem;
					}

						.row.gtr-50.gtr-uniform > * {
							padding-top: 0.625rem;
						}

				.row {
					margin-top: 0;
					margin-left: -1.25rem;
				}

					.row > * {
						padding: 0 0 0 1.25rem;
					}

					.row.gtr-uniform {
						margin-top: -1.25rem;
					}

						.row.gtr-uniform > * {
							padding-top: 1.25rem;
						}

				.row.gtr-150 {
					margin-top: 0;
					margin-left: -1.875rem;
				}

					.row.gtr-150 > * {
						padding: 0 0 0 1.875rem;
					}

					.row.gtr-150.gtr-uniform {
						margin-top: -1.875rem;
					}

						.row.gtr-150.gtr-uniform > * {
							padding-top: 1.875rem;
						}

				.row.gtr-200 {
					margin-top: 0;
					margin-left: -2.5rem;
				}

					.row.gtr-200 > * {
						padding: 0 0 0 2.5rem;
					}

					.row.gtr-200.gtr-uniform {
						margin-top: -2.5rem;
					}

						.row.gtr-200.gtr-uniform > * {
							padding-top: 2.5rem;
						}

		}

/* Box */

	.box {
		border: solid 2px rgba(144, 144, 144, 0.25);
		border-radius: 0.325rem;
		margin-bottom: 2rem;
		padding: 1.5rem;
	}

		.box > :last-child {
			margin-bottom: 0;
		}

		.box.alt {
			border: 0;
			border-radius: 0;
			padding: 0;
		}

/* Button */

	input[type="submit"],
	input[type="reset"],
	input[type="button"],
	button,
	.button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, color 0.25s ease-in-out;
		-webkit-transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, color 0.25s ease-in-out;
		-ms-transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, color 0.25s ease-in-out;
		transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, color 0.25s ease-in-out;
		background-color: transparent;
		border-radius: 0.325rem;
		border: 0;
		box-shadow: inset 0 0 0 2px rgba(144, 144, 144, 0.25);
		color: #000000 !important;
		cursor: pointer;
		display: inline-block;
		height: 3rem;
		letter-spacing: 0.175em;
		line-height: 3rem;
		padding: 0 2rem;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		white-space: nowrap;
	}

		input[type="submit"]:hover,
		input[type="reset"]:hover,
		input[type="button"]:hover,
		button:hover,
		.button:hover {
			box-shadow: inset 0 0 0 2px #2ee4bb;
			color: #2ee4bb !important;
		}

		input[type="submit"]:active,
		input[type="reset"]:active,
		input[type="button"]:active,
		button:active,
		.button:active {
			background-color: rgb(9 124 158 / 47%);
		    box-shadow: inset 0 0 0 2px #2ee4bb;
		    color: rgb(9 124 158 / 47%);
		    width: 200px !important;
		}

		input[type="submit"].small,
		input[type="reset"].small,
		input[type="button"].small,
		button.small,
		.button.small {
			font-size: 0.5rem;
			height: 2.25rem;
			line-height: 2.25rem;
			padding: 0 1.25rem;
		}

		input[type="submit"].large,
		input[type="reset"].large,
		input[type="button"].large,
		button.large,
		.button.large {
			font-size: 0.7rem;
			height: 3.2625rem;
			line-height: 3.2625rem;
			padding: 0 3.25rem;
		}

		input[type="submit"].wide,
		input[type="reset"].wide,
		input[type="button"].wide,
		button.wide,
		.button.wide {
			min-width: 13rem;
		}

		input[type="submit"].icon:before,
		input[type="reset"].icon:before,
		input[type="button"].icon:before,
		button.icon:before,
		.button.icon:before {
			margin-right: 0.5rem;
		}

		input[type="submit"].fit,
		input[type="reset"].fit,
		input[type="button"].fit,
		button.fit,
		.button.fit {
			width: 100%;
		}

		input[type="submit"].disabled, input[type="submit"]:disabled,
		input[type="reset"].disabled,
		input[type="reset"]:disabled,
		input[type="button"].disabled,
		input[type="button"]:disabled,
		button.disabled,
		button:disabled,
		.button.disabled,
		.button:disabled {
			pointer-events: none;
			opacity: 0.25;
		}

		input[type="submit"].primary,
		input[type="reset"].primary,
		input[type="button"].primary,
		button.primary,
		.button.primary {
			background-color: #49fcd4;
			box-shadow: none;
			color: #000000 !important;
		}

			input[type="submit"].primary:hover,
			input[type="reset"].primary:hover,
			input[type="button"].primary:hover,
			button.primary:hover,
			.button.primary:hover {
				background-color: #93ffe7;
			}

			input[type="submit"].primary:active,
			input[type="reset"].primary:active,
			input[type="button"].primary:active,
			button.primary:active,
			.button.primary:active {
				background-color: #44f2cb;
			}

		@media screen and (max-width: 736px) {

			input[type="submit"],
			input[type="reset"],
			input[type="button"],
			button,
			.button {
				font-size: 0.7rem;
				height: 3.3rem;
				line-height: 3.3rem;
			}

				input[type="submit"].large,
				input[type="reset"].large,
				input[type="button"].large,
				button.large,
				.button.large {
					font-size: 0.8rem;
					height: 3.75rem;
					line-height: 3.75rem;
				}

				input[type="submit"].small,
				input[type="reset"].small,
				input[type="button"].small,
				button.small,
				.button.small {
					font-size: 0.6rem;
					height: 3rem;
					line-height: 3rem;
				}

		}

/* Form */

	form {
		margin: 0 0 2rem 0;
	}

		form > :last-child {
			margin-bottom: 0;
		}

		form > .fields {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			margin: -2rem 0 2rem -2rem;
			width: calc(100% + 4rem);
		}

			form > .fields > .field {
				-moz-flex-grow: 0;
				-webkit-flex-grow: 0;
				-ms-flex-grow: 0;
				flex-grow: 0;
				-moz-flex-shrink: 0;
				-webkit-flex-shrink: 0;
				-ms-flex-shrink: 0;
				flex-shrink: 0;
				padding: 2rem 0 0 2rem;
				width: calc(100% - 2rem);
			}

				form > .fields > .field > :last-child {
					margin-bottom: 0;
				}

				form > .fields > .field.half {
					width: calc(50% - 1rem);
				}

				form > .fields > .field.third {
					width: calc(100%/3 - 0.66667rem);
				}

				form > .fields > .field.quarter {
					width: calc(25% - 0.5rem);
				}

		@media screen and (max-width: 480px) {

			form > .fields {
				margin: -1.5rem 0 2rem -1.5rem;
				width: calc(100% + 3rem);
			}

				form > .fields > .field {
					padding: 1.5rem 0 0 1.5rem;
					width: calc(100% - 1.5rem);
				}

					form > .fields > .field.half {
						width: calc(100% - 1.5rem);
					}

					form > .fields > .field.third {
						width: calc(100% - 1.5rem);
					}

					form > .fields > .field.quarter {
						width: calc(100% - 1.5rem);
					}

		}

		::-moz-selection { /* Code for Firefox */
			color: #fff;
			background: #f5f5f5d4;
		}

		::selection {
			color: #fff;
			background: #f5f5f5d4;
		}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	input[type="search"],
	input[type="url"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		border-radius: 0.325rem;
		border: solid 2px rgba(144, 144, 144, 0.25);
		color: inherit;
		display: block;
		outline: 0;
		padding: 0 1rem;
		text-decoration: none;
		width: 100%;
	}

		input[type="text"]:invalid,
		input[type="password"]:invalid,
		input[type="email"]:invalid,
		input[type="tel"]:invalid,
		input[type="search"]:invalid,
		input[type="url"]:invalid,
		select:invalid,
		textarea:invalid {
			box-shadow: none;
		}

		input[type="text"]:focus,
		input[type="password"]:focus,
		input[type="email"]:focus,
		input[type="tel"]:focus,
		input[type="search"]:focus,
		input[type="url"]:focus,
		select:focus,
		textarea:focus {
			/*border-color: #2ee4bb;*/
		}

	label {
		color: #000000;
		display: block;
		letter-spacing: 0.175em;
		line-height: 1.75;
		margin: 0 0 1rem 0;
		text-transform: uppercase;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="tel"],
	input[type="search"],
	input[type="url"] {
		height: 3rem;
	}

	select {
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='rgba(144, 144, 144, 0.25)' /%3E%3C/svg%3E");
		background-position: calc(100% - 1rem) center;
		background-repeat: no-repeat;
		background-size: 1.25rem;
		height: 3rem;
		padding-right: 3rem;
		text-overflow: ellipsis;
	}

		select option {
			background-color: #ffffff;
			color: #000000;
		}

		select:focus::-ms-value {
			background-color: transparent;
		}

		select::-ms-expand {
			display: none;
		}

	textarea {
		padding: 0.75rem 1rem;
	}

	input[type="checkbox"],
	input[type="radio"] {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		display: block;
		float: left;
		margin-right: -2rem;
		opacity: 0;
		width: 1rem;
		z-index: -1;
	}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			text-decoration: none;
			color: #000000;
			cursor: pointer;
			display: inline-block;			
			letter-spacing: 0.0375em;
			padding-left: 2.675rem;
			padding-right: 0.875rem;
			position: relative;
			text-transform: none;
		}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				display: inline-block;
				font-style: normal;
				font-variant: normal;
				text-rendering: auto;
				line-height: 1;
				text-transform: none !important;				
			}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				border-radius: 0.325rem;
				border: solid 2px rgba(144, 144, 144, 0.25);
				content: '';
				display: inline-block;
				font-size: 0.8rem;
				height: 2.25rem;
				left: 0;
				line-height: 2.25rem;
				position: absolute;
				text-align: center;
				top: -0.15rem;
				width: 2.25rem;
			}

		input[type="checkbox"]:checked + label:before,
		input[type="radio"]:checked + label:before {
		    background: linear-gradient(0deg, #05cefb 0%, #00b4a8 78%);
		    border: solid 2px #05cefb;
		}

		input[type="checkbox"]:focus + label:before,
		input[type="radio"]:focus + label:before {
			/*border-color: #fff;*/
			/*box-shadow: 0 0 0 1px #49fcd4;*/
		}
		input:focus {
			background-color: transparent !important;
		}
	input[type="checkbox"] + label:before {
		border-radius: 0.325rem;
	}

	input[type="radio"] + label:before {
		border-radius: 100%;
		width: 15px;
		height: 15px;
		border: 1px solid #f5f5f5d4;
		top: 1em;
	}

	::-webkit-input-placeholder {
		opacity: 1.0;
		color: #fff !important;
		font-size: 15px;
	    text-decoration: none;
	    border: none;
	    letter-spacing: 6px;
	    line-height: 2;

	}

	:-moz-placeholder {
		opacity: 1.0;
		color: #fff !important;
		font-size: 15px;
	    text-decoration: none;
	    border: none;
	    letter-spacing: 6px;
	    line-height: 2;
	}

	::-moz-placeholder {
		opacity: 1.0;
		color: #fff !important;
		font-size: 15px;
	    text-decoration: none;
	    border: none;
	    letter-spacing: 6px;
	    line-height: 2;
	}

	:-ms-input-placeholder {
		opacity: 1.0;
		color: #fff !important;
		font-size: 15px;
	    text-decoration: none;
	    border: none;
	    letter-spacing: 6px;
	    line-height: 2;
	}

	@media screen and (max-width: 736px) {

		label {
			font-size: 0.675rem;
		}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			font-size: 1rem;
		}

	}

	@media screen and (max-width: 360px) {

		label {
			font-size: 0.675rem;
		}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			font-size: 1rem;
		}

	}

/* Icon */

	.icon {
		text-decoration: none;
		border-bottom: none;
		position: relative;
	}

		.icon:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			display: inline-block;
			font-style: normal;
			font-variant: normal;
			text-rendering: auto;
			line-height: 1;
			text-transform: none !important;
			font-family: 'Font Awesome 5 Free';
			font-weight: 400;
		}

		.icon > .label {
			display: none;
		}

		.icon.solid:before {
			font-weight: 900;
		}

		.icon.brands:before {
			font-family: 'Font Awesome 5 Brands';
		}

/* Image */

	.image {
		border: 0;
		display: inline-block;
		position: relative;
	}

		.image img {
			display: block;
		}

		.image[data-position] img {
			-moz-object-fit: cover;
			-webkit-object-fit: cover;
			-ms-object-fit: cover;
			object-fit: cover;
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

		.image[data-position="top left"] img {
			-moz-object-position: top left;
			-webkit-object-position: top left;
			-ms-object-position: top left;
			object-position: top left;
		}

		.image[data-position="top"] img {
			-moz-object-position: top;
			-webkit-object-position: top;
			-ms-object-position: top;
			object-position: top;
		}

		.image[data-position="top right"] img {
			-moz-object-position: top right;
			-webkit-object-position: top right;
			-ms-object-position: top right;
			object-position: top right;
		}

		.image[data-position="right"] img {
			-moz-object-position: right;
			-webkit-object-position: right;
			-ms-object-position: right;
			object-position: right;
		}

		.image[data-position="bottom right"] img {
			-moz-object-position: bottom right;
			-webkit-object-position: bottom right;
			-ms-object-position: bottom right;
			object-position: bottom right;
		}

		.image[data-position="bottom"] img {
			-moz-object-position: bottom;
			-webkit-object-position: bottom;
			-ms-object-position: bottom;
			object-position: bottom;
		}

		.image[data-position="bottom left"] img {
			-moz-object-position: bottom left;
			-webkit-object-position: bottom left;
			-ms-object-position: bottom left;
			object-position: bottom left;
		}

		.image[data-position="left"] img {
			-moz-object-position: left;
			-webkit-object-position: left;
			-ms-object-position: left;
			object-position: left;
		}

		.image[data-position="center"] img {
			-moz-object-position: center;
			-webkit-object-position: center;
			-ms-object-position: center;
			object-position: center;
		}

		.image[data-position="25% 25%"] img {
			-moz-object-position: 25% 25%;
			-webkit-object-position: 25% 25%;
			-ms-object-position: 25% 25%;
			object-position: 25% 25%;
		}

		.image[data-position="75% 25%"] img {
			-moz-object-position: 75% 25%;
			-webkit-object-position: 75% 25%;
			-ms-object-position: 75% 25%;
			object-position: 75% 25%;
		}

		.image[data-position="75% 75%"] img {
			-moz-object-position: 75% 75%;
			-webkit-object-position: 75% 75%;
			-ms-object-position: 75% 75%;
			object-position: 75% 75%;
		}

		.image[data-position="25% 75%"] img {
			-moz-object-position: 25% 75%;
			-webkit-object-position: 25% 75%;
			-ms-object-position: 25% 75%;
			object-position: 25% 75%;
		}

		.image.left, .image.right {
			max-width: 40%;
		}

			.image.left img, .image.right img {
				width: 100%;
			}

		.image.left {
			float: left;
			margin: 0 2rem 2rem 0;
			top: 0.25rem;
		}

		.image.right {
			float: right;
			margin: 0 0 2rem 2rem;
			top: 0.25rem;
		}

		.image.fit {
			display: block;
			margin: 0 0 2rem 0;
			width: 100%;
		}

			.image.fit img {
				width: 100%;
			}

		.image.main {
			display: block;
			margin: 3rem 0;
			width: 100%;
		}

			.image.main img {
				width: 100%;
			}

			.image.main:first-child {
				margin-top: 0;
			}

		.image.fill {
			height: 100%;
			left: 0;
			position: absolute;
			top: 0;
			width: 100%;
		}

			.image.fill img {
				height: 100%;
				left: 0;
				position: absolute;
				top: 0;
				width: 100%;
			}

/* List */

	ol {
		list-style: decimal;
		margin: 0 0 2rem 0;
		padding-left: 1.25rem;
	}

		ol li {
			padding-left: 0.25rem;
		}

	ul {
		list-style: disc;
		margin: 0 0 2rem 0;
		padding-left: 1rem;
	}

		ul li {
			padding-left: 0.325rem;
		}

		ul.alt {
			list-style: none;
			padding-left: 0;
		}

			ul.alt > li {
				border-top: solid 1px rgba(144, 144, 144, 0.25);
				padding: 0.75rem 0;
			}

				ul.alt > li:first-child {
					border-top: 0;
					padding-top: 0;
				}

				ul.alt > li:last-child {
					padding-bottom: 0;
				}

		ul.items {
			list-style: none;
			padding-left: 0;
		}

			ul.items > li {
				padding-left: 0;
				margin: 0 0 3rem 0;
			}

				ul.items > li > h3 {
					margin: 0 0 1rem 0;
				}

				ul.items > li > :last-child {
					margin-bottom: 0;
				}

				ul.items > li:last-child {
					margin-bottom: 0;
				}

		@media screen and (max-width: 736px) {

			ul.items > li {
				margin: 0 0 2rem 0;
			}

		}

	dl {
		margin: 0 0 2rem 0;
	}

		dl dt {
			display: block;
			font-weight: 600;
			margin: 0 0 1rem 0;
		}

		dl dd {
			margin-left: 1.5rem;
		}

/* Actions */

	ul.actions {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		cursor: default;
		list-style: none;
		margin-left: -1rem;
		padding-left: 0;
	}

		ul.actions li {
			padding: 0 0 0 1rem;
			vertical-align: middle;
		}

		ul.actions.special {
			-moz-justify-content: center;
			-webkit-justify-content: center;
			-ms-justify-content: center;
			justify-content: center;
			width: 100%;
			margin-left: 0;
		}

			ul.actions.special li:first-child {
				padding-left: 0;
			}

		ul.actions.stacked {
			-moz-flex-direction: column;
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
			margin-left: 0;
		}

			ul.actions.stacked li {
				padding: 1.3rem 0 0 0;
			}

				ul.actions.stacked li:first-child {
					padding-top: 0;
				}

		ul.actions.fit {
			width: calc(100% + 1rem);
		}

			ul.actions.fit li {
				-moz-flex-grow: 1;
				-webkit-flex-grow: 1;
				-ms-flex-grow: 1;
				flex-grow: 1;
				-moz-flex-shrink: 1;
				-webkit-flex-shrink: 1;
				-ms-flex-shrink: 1;
				flex-shrink: 1;
				width: 100%;
			}

				ul.actions.fit li > * {
					width: 100%;
				}

			ul.actions.fit.stacked {
				width: 100%;
			}

		@media screen and (max-width: 480px) {

			ul.actions:not(.fixed) {
				-moz-flex-direction: column;
				-webkit-flex-direction: column;
				-ms-flex-direction: column;
				flex-direction: column;
				margin-left: 0;
				width: 100% !important;
			}

				ul.actions:not(.fixed) li {
					-moz-flex-grow: 1;
					-webkit-flex-grow: 1;
					-ms-flex-grow: 1;
					flex-grow: 1;
					-moz-flex-shrink: 1;
					-webkit-flex-shrink: 1;
					-ms-flex-shrink: 1;
					flex-shrink: 1;
					padding: 1rem 0 0 0;
					text-align: center;
					width: 100%;
				}

					ul.actions:not(.fixed) li > * {
						width: 100%;
					}

					ul.actions:not(.fixed) li:first-child {
						padding-top: 0;
					}

					ul.actions:not(.fixed) li input[type="submit"],
					ul.actions:not(.fixed) li input[type="reset"],
					ul.actions:not(.fixed) li input[type="button"],
					ul.actions:not(.fixed) li button,
					ul.actions:not(.fixed) li .button {
						width: 100%;
					}

						ul.actions:not(.fixed) li input[type="submit"].icon:before,
						ul.actions:not(.fixed) li input[type="reset"].icon:before,
						ul.actions:not(.fixed) li input[type="button"].icon:before,
						ul.actions:not(.fixed) li button.icon:before,
						ul.actions:not(.fixed) li .button.icon:before {
							margin-left: -0.5rem;
						}

		}

/* Icons */

	ul.icons {
		cursor: default;
		list-style: none;
		padding-left: 0;
	}

		ul.icons li {
			display: inline-block;
		}

			ul.icons li:last-child {
				padding-right: 0;
			}

			ul.icons li .icon {
				-moz-transition: background-color 0.25s ease-in-out;
				-webkit-transition: background-color 0.25s ease-in-out;
				-ms-transition: background-color 0.25s ease-in-out;
				transition: background-color 0.25s ease-in-out;
				width: 2.25rem;
				height: 2.25rem;
				text-align: center;
				line-height: 2.25rem;
				border-radius: 2.25rem;
				display: inline-block;
			}

				ul.icons li .icon:before {
					font-size: 1.25rem;
				}

				ul.icons li .icon:hover {
					background-color: rgba(144, 144, 144, 0.1);
				}

/* Table */

	.table-wrapper {
		-webkit-overflow-scrolling: touch;
		overflow-x: auto;
	}

	table {
		margin: 0 0 2rem 0;
		width: 100%;
	}

		table tbody tr {
			border: solid 1px rgba(144, 144, 144, 0.25);
			border-left: 0;
			border-right: 0;
		}

			table tbody tr:nth-child(2n + 1) {
				background-color: rgba(144, 144, 144, 0.1);
			}

		table td {
			padding: 0.75rem 0.75rem;
		}

		table th {
			color: #000000;
			font-size: 0.9rem;
			font-weight: 600;
			padding: 0 0.75rem 0.75rem 0.75rem;
			text-align: left;
		}

		table thead {
			border-bottom: solid 2px rgba(144, 144, 144, 0.25);
		}

		table tfoot {
			border-top: solid 2px rgba(144, 144, 144, 0.25);
		}

		table.alt {
			border-collapse: separate;
		}

			table.alt tbody tr td {
				border: solid 1px rgba(144, 144, 144, 0.25);
				border-left-width: 0;
				border-top-width: 0;
			}

				table.alt tbody tr td:first-child {
					border-left-width: 1px;
				}

			table.alt tbody tr:first-child td {
				border-top-width: 1px;
			}

			table.alt thead {
				border-bottom: 0;
			}

			table.alt tfoot {
				border-top: 0;
			}

/* Arrow */

	a.arrow {
		border-bottom: 0;
		display: inline-block;
		height: 4rem;
		position: relative;
		width: 6rem;
	}

		a.arrow .label {
			display: none;
		}

		a.arrow:before {
			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512'%3E%3Cpath d='M442.53,346.28L293.65,495.16c-0.33,0.33-0.7,0.62-1.05,0.94c-9.16,9.77-22.15,15.9-36.6,15.9 c-14.44,0-27.43-6.13-36.59-15.88c-0.35-0.33-0.72-0.62-1.06-0.96L69.47,346.28c-19.62-19.62-19.62-51.44,0-71.05 c19.62-19.62,51.43-19.62,71.06,0l65.23,65.23V50.24C205.76,22.5,228.25,0,256,0s50.24,22.5,50.24,50.24v290.21l65.23-65.23 c19.62-19.62,51.43-19.62,71.05,0C462.15,294.84,462.15,326.66,442.53,346.28z' fill='%23000000' /%3E%3C/svg%3E");
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
			content: '';
			display: inline-block;
			height: 100%;
			position: relative;
			width: 3rem;
		}

/* Gallery */

	@-moz-keyframes gallery-modal-spinner {
		0% {
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-moz-transform: rotate(360deg);
			-webkit-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	@-webkit-keyframes gallery-modal-spinner {
		0% {
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-moz-transform: rotate(360deg);
			-webkit-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	@-ms-keyframes gallery-modal-spinner {
		0% {
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-moz-transform: rotate(360deg);
			-webkit-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	@keyframes gallery-modal-spinner {
		0% {
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			transform: rotate(0deg);
		}

		100% {
			-moz-transform: rotate(360deg);
			-webkit-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}

	.gallery {
		display: flex;
		flex-wrap: wrap;
		margin: -1.25rem 0 0 -1.25rem;
		width: calc(100% + 1.25rem);
	}

		.gallery a {
			border-bottom: 0;
			display: block;
			margin: 1.25rem 0 0 1.25rem;
			outline: 0;
			position: relative;
			width: calc(50% - 1.25rem);
		}

			.gallery a img {
				display: block;
				height: 25vw;
				min-height: 18rem;
				object-fit: cover;
				object-position: center;
				width: 100%;
			}

			.gallery a.landscape {
				width: 100%;
			}

				.gallery a.landscape img {
					height: 30vw;
				}

			.gallery a.portrait img {
				height: 30vw;
			}

		.gallery .modal {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-align-items: center;
			-webkit-align-items: center;
			-ms-align-items: center;
			align-items: center;
			-moz-justify-content: center;
			-webkit-justify-content: center;
			-ms-justify-content: center;
			justify-content: center;
			pointer-events: none;
			-moz-user-select: none;
			-webkit-user-select: none;
			-ms-user-select: none;
			user-select: none;
			-moz-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
			-webkit-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
			-ms-transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
			transition: opacity 0.5s ease, visibility 0.5s, z-index 0.5s;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			background-color: rgba(255, 255, 255, 0.875);
			height: 100%;
			left: 0;
			opacity: 0;
			outline: 0;
			position: fixed;
			top: 0;
			visibility: none;
			width: 100%;
			z-index: 0;
		}

			.gallery .modal:before {
				-moz-animation: gallery-modal-spinner 1s infinite linear;
				-webkit-animation: gallery-modal-spinner 1s infinite linear;
				-ms-animation: gallery-modal-spinner 1s infinite linear;
				animation: gallery-modal-spinner 1s infinite linear;
				-moz-transition: opacity 0.25s ease;
				-webkit-transition: opacity 0.25s ease;
				-ms-transition: opacity 0.25s ease;
				transition: opacity 0.25s ease;
				-moz-transition-delay: 0.5s;
				-webkit-transition-delay: 0.5s;
				-ms-transition-delay: 0.5s;
				transition-delay: 0.5s;
				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='96px' height='96px' viewBox='0 0 96 96' zoomAndPan='disable'%3E%3Cstyle%3Ecircle %7Bfill: transparent%3B stroke: %23000000%3B stroke-width: 2px%3B %7D%3C/style%3E%3Cdefs%3E%3CclipPath id='corner'%3E%3Cpolygon points='0,0 48,0 48,48 96,48 96,96 0,96' /%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23corner)'%3E%3Ccircle cx='48' cy='48' r='32'/%3E%3C/g%3E%3C/svg%3E");
				background-position: center;
				background-repeat: no-repeat;
				background-size: 4rem;
				content: '';
				display: block;
				height: 4rem;
				left: 50%;
				margin: -2rem 0 0 -2rem;
				opacity: 0;
				position: absolute;
				top: 50%;
				width: 4rem;
			}

			.gallery .modal:after {
				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='64px' height='64px' viewBox='0 0 64 64' zoomAndPan='disable'%3E%3Cstyle%3Eline %7Bstroke: %23000000%3Bstroke-width: 2px%3B%7D%3C/style%3E%3Cline x1='20' y1='20' x2='44' y2='44' /%3E%3Cline x1='20' y1='44' x2='44' y2='20' /%3E%3C/svg%3E");
				background-position: center;
				background-repeat: no-repeat;
				background-size: 3rem;
				content: '';
				cursor: pointer;
				display: block;
				height: 4rem;
				position: absolute;
				right: 0.5rem;
				top: 0.5rem;
				width: 4rem;
			}

			.gallery .modal .inner {
				-moz-transform: translateY(0.75rem);
				-webkit-transform: translateY(0.75rem);
				-ms-transform: translateY(0.75rem);
				transform: translateY(0.75rem);
				-moz-transition: opacity 0.25s ease, -moz-transform 0.25s ease;
				-webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
				-ms-transition: opacity 0.25s ease, -ms-transform 0.25s ease;
				transition: opacity 0.25s ease, transform 0.25s ease;
				opacity: 0;
			}

				.gallery .modal .inner img {
					box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.35);
					display: block;
					max-height: 90vh;
					max-width: 90vw;
				}

			.gallery .modal.visible {
				pointer-events: auto;
				opacity: 1;
				visibility: visible;
				z-index: 11000;
			}

				.gallery .modal.visible:before {
					opacity: 1;
				}

			.gallery .modal.loaded .inner {
				-moz-transform: translateY(0);
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
				-moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease;
				-webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
				-ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease;
				transition: opacity 0.5s ease, transform 0.5s ease;
				opacity: 1;
			}

			.gallery .modal.loaded:before {
				-moz-transition-delay: 0s;
				-webkit-transition-delay: 0s;
				-ms-transition-delay: 0s;
				transition-delay: 0s;
				opacity: 0;
			}

		@media screen and (max-width: 1152px) {

			.gallery a img {
				height: 20rem;
			}

			.gallery a.landscape img {
				height: 25rem;
			}

			.gallery a.portrait img {
				height: 25rem;
			}

			.gallery .modal .inner img {
				max-width: 100vw;
			}

		}

		@media screen and (max-width: 736px) {

			.gallery {
				margin: -0.625rem 0 0 -0.625rem;
				width: calc(100% + 0.625rem);
			}

				.gallery a {
					margin: 0.625rem 0 0 0.625rem;
					width: calc(50% - 0.625rem);
				}

					.gallery a img {
						height: 20rem;
					}

					.gallery a.landscape img {
						height: 20rem;
					}

					.gallery a.portrait img {
						height: 30rem;
					}

		}

		@media screen and (max-width: 480px) {

			.gallery a img {
				height: 12rem;
				min-height: 0;
			}

			.gallery a.landscape img {
				height: 12rem;
			}

			.gallery a.portrait img {
				height: 14rem;
			}

		}

/* Feature Icons */

	ul.feature-icons {
		display: flex;
		flex-wrap: wrap;
		list-style: none;
		margin: 3rem 0;
		padding-left: 0;
	}

		ul.feature-icons:first-child {
			margin-top: 0;
		}

		ul.feature-icons li {
			margin: 2.5rem 0 0 0;
			padding: 0.5rem 0 0 4.5rem;
			position: relative;
			width: 50%;
		}

			ul.feature-icons li:before {
				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' viewBox='0 0 512 512'%3E%3Cpath d='M256,0l221.7,128v256L256,512L34.3,384V128L256,0z' fill='rgba(144, 144, 144, 0.1)' /%3E%3C/svg%3E");
				background-position: center;
				background-repeat: no-repeat;
				background-size: contain;
				color: #000000;
				display: block;
				font-size: 1.25rem;
				height: 3.25rem;
				left: 0;
				line-height: 3.25rem;
				position: absolute;
				text-align: center;
				top: 0;
				width: 3.25rem;
			}

			ul.feature-icons li:nth-child(1), ul.feature-icons li:nth-child(2) {
				margin-top: 0;
			}

		@media screen and (max-width: 736px) {

			ul.feature-icons {
				margin: 0 0 3rem 0;
			}

				ul.feature-icons li {
					width: 100%;
				}

					ul.feature-icons li:nth-child(2) {
						margin-top: 2rem;
					}

		}

/* Wrapper */

#wrapper {
	position: relative;
	width: 100vw;
}

.wrapper-contact:before {
	background-attachment: fixed;
	background-color: #49fcd4;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 920 1750' x='0px' y='0px'%3E %3Cpath style='fill: rgba(67, 217, 184, 0.25)' d='M889.72,1137.55l-2.91-0.75l-364.39,282.94l-0.7-0.9l-0.51,0.11l-94.77-451.5l-32.51-15.75l-16.73-8.11l0,0.68 l-1.46,0l0-1.39l-1.89-0.92l-112.41-54.47l-0.29,1.03l-1.41-0.37l0.37-1.31l-34.14-16.54l-98.56-47.76l-0.59,0.81l-1.16-0.88 l0.42-0.57L11.43,766.33l-0.25,0.2l-0.9-1.15l102.87-79.98l0.08-0.1l0.02,0.02l116.68-90.72l-0.18-0.34l1.3-0.66l0.05,0.09 l100.5-78.14l-0.07-0.32l0.65-0.14l42.3-32.89l-0.15-54.54l-0.59,0.29l-0.64-1.31l1.23-0.6l-0.01-4.54l-0.33-122.47l-0.99,0.18 l-0.28-1.43l1.27-0.23l-0.4-147.49l-0.87-0.16l0.28-1.43l0.58,0.1l-0.35-127.48l-0.13-0.06l0.64-1.31L489.97,76.8l0.73,0.19 l-0.04,0.14l132.63,65.11l0.33-0.45l1.16,0.88l-0.16,0.22l114.21,56.07l0.45-0.35l0.72,0.93l47.89,23.51l2.76-1.36l0.56,4.61 l-3.32-1.63L571.52,330.88L375.95,482.93l0.66,239.95l51.12,243.57l222.53,107.83l236.23,60.93l2.27-1.77 M375.8,425.34l17.25-8.47 l36.13-127.75l-53.73,9.66L375.8,425.34z M551,241.05l38.19-52.2l-123.83-22.27l-34.13,120.68l98.99-17.81L551,241.05z M532.3,269.09l151.34-27.22l37.63-29.25l-130.48-23.47L532.3,269.09z M303.38,733.9l-2.36-4.48l-44.18-83.78L182.5,747.25 l40.78,36.46l52.69,47.11L303.38,733.9z M277.18,831.91l56.95,50.93L375.69,920l-0.13-49.23l-71.19-135L277.18,831.91z M303.96,731.86l41.93-148.25l-9.74-46.39L257.8,644.33L303.96,731.86z M304.94,733.73l9.55,18.12l61.05,115.78l-0.39-144.6 l-16.9-80.53l-11.71-55.81L304.94,733.73z M375.21,211.79l0.23,85.51l54.17-9.74l34.29-121.23l-88.87-15.98L375.21,211.79z M430.78,288.83l-17.88,63.21L394.81,416l44.01-21.6l90.15-123.23L430.78,288.83z M287.76,898.62l87.99,42.64l-0.05-19.29 l-91.37-81.71l-7.59-6.78l-14.88,52.59L287.76,898.62z M174.26,843.62l86.26,41.8l15-53.03l-93.89-83.95l-53.34,72.91L174.26,843.62 z M113.18,687.22L12.71,765.33l55.69,26.99l58.56,28.38l53.58-73.24l-34.83-31.14L113.18,687.22z M230.62,595.92l-116.27,90.4 l63.02,56.36l4.03,3.61l74.67-102.08l-7.47-14.17L230.62,595.92z M331.94,517.15l-100.15,77.86l25.25,47.88l78.71-107.59l-1.71-8.14 L331.94,517.15z M333.22,516.15l2.02,9.64l1.66,7.92l34.65-47.37L333.22,516.15z M337.31,535.63l9.43,44.95l26.67-94.3 L337.31,535.63z M347.39,583.66l27.74,132.16l-0.62-228.04L347.39,583.66z M374.7,21.83l0.35,127.02l89.27,16.06l24.61-87 L374.7,21.83z M490.25,78.56l-22.26,78.7l-2.24,7.91l124.39,22.37l10.23-13.99l22.04-30.12L490.25,78.56z M623.74,144.09 l-12.29,16.8l-19.71,26.95l131.07,23.58l14.73-11.45L623.74,144.09z M739,200.67l-13.3,10.34l-0.96,0.74l58.14,10.46L739,200.67z M723.19,212.96l-25.33,19.69l-11.14,8.66l97.03-17.45L723.19,212.96z M782.89,225.5l-98.64,17.74l-107.06,83.23L782.89,225.5z M631.68,282.26l49.48-38.47l-150.1,27l-89.41,122.22l129.1-63.37L631.68,282.26z M565.06,334.05l-125.28,61.5l-45.94,62.8 l-14.96,20.44L565.06,334.05z M425.31,412.87l11.65-15.93l-42.69,20.96l-13.66,48.3l-3.58,12.67L425.31,412.87z M392.51,418.76 l-16.71,8.2l0.01,4.72l0.12,45.68L392.51,418.76z M377.21,941.96l21.37,10.36l24.14,11.7l-45.56-40.74L377.21,941.96z M377.15,921.31l34.83,31.15l12.57,11.24l-47.53-90.14L377.15,921.31z M376.63,730.07l0.38,140.33l48.29,91.59L376.63,730.07z M806.29,1197.48l75.8-58.86l-28.56,11.47l-25.6,10.28l14.96,7.25l-0.64,1.31l-16.16-7.83l-124.76,50.1l40.56,36.27L806.29,1197.48z M522.43,1146.18l58.88,111.66l52.71-21.17l64.61-25.95l-75.11-67.17L522.43,1146.18z M621.92,1142.14l-115.78-103.53l-46.8-12.07 l62.33,118.2l7.06-0.18L621.92,1142.14z M700.14,1210.12l124.19-49.87l-42.89-20.78l-155.8,4.04L700.14,1210.12z M679.7,1295.77 l61.03-47.39l-40.9-36.57l-117.85,47.32l42.09,79.82L679.7,1295.77z M522.48,1417.85l1.83-1.42l98.6-76.56l-42.28-80.19 l-84.25,33.83L522.48,1417.85z M496.08,1292.06l83.87-33.68l-59.14-112.16l-55.04,1.43L496.08,1292.06z M465.46,1146.2l54.58-1.42 l-62.61-118.74l-18.03-4.65l0.36-1.41l16.74,4.32l-27.63-52.4L465.46,1146.2z M458.42,1024.79l45.35,11.7l-74.14-66.29 L458.42,1024.79z M431.46,969.87l75.38,67.41l136.26,35.15L431.46,969.87z M649.76,1075.65l-140.54-36.25l114.83,102.68l154.53-4.01 L649.76,1075.65z M656.92,1077.5l124.84,60.5l51.97-1.35l47.7-1.24L656.92,1077.5z M784.62,1139.38l41.54,20.13l56.45-22.67 L784.62,1139.38z'/%3E %3C/svg%3E");
	background-position: -50% 10%;
	background-repeat: repeat-y;
	background-size: 75% auto;
	content: '';
}
#wrapper:before {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 50vw;
	z-index: -1;
}

#wrapper section {
	display: grid;
	grid-template-areas: "header content" "footer content";
	/*grid-template-columns: 50vw 50vw;*/
	grid-template-rows: 1fr;
}

#wrapper section:first-child {
	margin-top: 15em;
}

#wrapper section header {
	grid-area: header;
	justify-self: end;
	text-align: right;
}

#wrapper section header h2 {
	margin: 0 0 5rem 0;
}

#wrapper section header ul.actions {
	justify-content: flex-end;
}

#wrapper section .content {
	grid-area: content;
	max-width: 60rem;
    width: 100rem;
	position: relative;
}

#wrapper section footer {
	grid-area: footer;
	text-align: right;
}

#wrapper section footer ul.actions {
	justify-content: flex-end;
}

#wrapper section {
	position: relative;
}

#wrapper section header:before, div#block-contact section header:before {
    /*background: linear-gradient(0deg, #05cefb 0%, #00b4a8 78%);
	content: '';
	display: block;
	margin-top: 1rem;
	position: absolute;
	width: 2px;
    right: 54%;*/
}

#wrapper section header h1, #wrapper section header h2 {
	position: relative;
}

#wrapper section header h1:before, #wrapper section header h2:before {
	background: #00b4a8;
	content: '';
	display: block;
	height: 2px;
	position: absolute;
	top: 1rem;
}

#wrapper section header h1:after, #wrapper section header h2:after {
	background: #00b4a8;
	border-radius: 0.5rem;
	content: '';
	display: block;
	height: 0.5rem;
	position: absolute;
	top: 0.75rem;
	width: 0.5rem;
}

#wrapper section header h1 {
	margin-top: -2rem;
}

#wrapper section header h1:before {
	top: 3rem;
}

#wrapper section header h1:after {
	top: 2.75rem;
}

#wrapper section .content section {
	position: relative;
}

#wrapper section .content section:first-child {
	margin-top: 6rem;
}

#wrapper section.intro {
	align-items: center;
}

#wrapper > section.intro > header {
	padding-top: 4rem;
	width: 100%;
}

#wrapper > section.intro > header > * {
	margin-left: auto;
}

#wrapper > section.intro > header:before {
	left: auto;
}

#wrapper > section.intro > .content {
	height: 100vh;
	max-width: none;
}

#wrapper section:last-of-type header:before {
	/*height: 100%;*/
}

#wrapper section:last-of-type header:after {
	/*background: #00b4a8;
	border-radius: 0.5rem;
	bottom: -1.5rem;
	content: '';
	display: block;
	height: 0.5rem;
	position: absolute;
	width: 0.5rem;
	z-index: 1;
	left: 45.65%;*/
}

#wrapper .copyright a {
	color: inherit;
}

#wrapper section {
	margin: 10em 0 0 0;
}

#wrapper section header {
	padding: 0 10rem 0 5rem;
	width: 35rem;
}

#wrapper section .content {
	padding: 0;
}
div#block-contact section .content {
    max-width: 700px;
    width: 100%;
    padding: 0 !important;
	margin-left: 5em;
}
div#block-contact section .head-content {
	padding-right: 3em;
    border: solid;
    border-width: 0 .15em 0 0;
    border-image: linear-gradient( to bottom, #00b4a8, rgba(0, 0, 0, 0) ) 2 100%;
    height: 100%;
}
div#block-contact section .head-content header h2 {
	top: -10px;
}
#wrapper section footer {
    padding: 0;
    width: 100%;
}

#wrapper section header:before {
	/*height: calc(100% + 10rem);
	left: calc(50vw - 35rem);*/
}

#wrapper section header h1:before, #wrapper section header h2:before {
	right: -4.4rem;
	width: 2.5rem;
}

#wrapper section header h1:after, #wrapper section header h2:after {
	right: -2rem;
}

#wrapper section .content section {
	left: calc(-50vw - 5rem);
}

#wrapper section .content section header {
	width: 32rem;
}

#wrapper section.intro header * {
	width: 20rem;
}

#wrapper > section.intro > header:before {
	margin-left: calc(50vw - 10rem);
}

@media screen and (max-width: 1152px) {

	#wrapper > section.intro > header > * {
		width: 100%;
	}

	#wrapper > section.intro > header:before {
		margin-left: 0;
	}

}

#wrapper section:last-of-type header:after {
	/*left: calc(50vw - 35rem - 0.25rem + 1px);*/
}

#wrapper .copyright {
	/*padding: 0 5rem;*/
}

@media screen and (max-width: 1280px) {

	#wrapper {
		/*padding: 0 0 8rem 0;*/
	}

	#wrapper section {
		margin: 6rem 0 0 0;
	}

	#wrapper section header {
		padding: 0 8rem 0 4rem;
		width: 33rem;
	}

	#wrapper section .content {
		padding: 0 4rem;
	}

	#wrapper section footer {
		/*padding: 0 8rem;*/
		/*padding: 0 10em 0 0;*/
	}

	#wrapper section header:before {
		/*height: calc(100% + 8rem);
		left: calc(50vw - 34rem);*/
	}

	#wrapper section header h1:before, #wrapper section header h2:before {
		right: -4.4rem;
		width: 2rem;
	}

	#wrapper section header h1:after, #wrapper section header h2:after {
		right: -2rem;
	}

	#wrapper section .content section {
		left: calc(-50vw - 4rem);
	}

	#wrapper section .content section header {
		width: 30rem;
	}

	#wrapper section.intro header * {
		width: 21rem;
	}

	#wrapper > section.intro > header:before {
		margin-left: calc(50vw - 8rem);
	}

}

@media screen and (max-width: 1280px) and (max-width: 1152px) {

	#wrapper > section.intro > header > * {
		width: 100%;
	}

	#wrapper > section.intro > header:before {
		margin-left: 0;
	}

}

@media screen and (max-width: 1280px) {

	#wrapper section:last-of-type header:after {
		/*left: calc(50vw -34rem - 0.25rem + 1px);*/
	}

	#wrapper .copyright {
		padding: 0 4rem;
	}

}

@media screen and (max-width: 1152px) {

	#wrapper {
		padding: 0;
	}

	#wrapper:before {
		display: none;
	}

	#wrapper section {
		grid-template-areas: "header" "content" "footer";
		grid-template-columns: 1fr;
		grid-template-rows: 3fr;
	}

	#wrapper section header {
		justify-self: start;
		padding: 0;
		text-align: left;
		width: 100%;
	}

	#wrapper section header ul.actions {
		justify-content: flex-start;
	}

	#wrapper section .content {
		padding: 0;
		width: 100%;
		overflow-x: hidden;
	}

	#wrapper section footer {
		/*padding: 0;*/

		/*text-align: left;*/
	}

	#wrapper section footer ul.actions {
		justify-content: flex-start;
	}

	#wrapper section {
		margin: 0;
	}

	#wrapper section header {
		/*background-attachment: fixed;
		background-color: #49fcd4;
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 920 1750' x='0px' y='0px'%3E %3Cpath style='fill: rgba(67, 217, 184, 0.5)' d='M889.72,1137.55l-2.91-0.75l-364.39,282.94l-0.7-0.9l-0.51,0.11l-94.77-451.5l-32.51-15.75l-16.73-8.11l0,0.68 l-1.46,0l0-1.39l-1.89-0.92l-112.41-54.47l-0.29,1.03l-1.41-0.37l0.37-1.31l-34.14-16.54l-98.56-47.76l-0.59,0.81l-1.16-0.88 l0.42-0.57L11.43,766.33l-0.25,0.2l-0.9-1.15l102.87-79.98l0.08-0.1l0.02,0.02l116.68-90.72l-0.18-0.34l1.3-0.66l0.05,0.09 l100.5-78.14l-0.07-0.32l0.65-0.14l42.3-32.89l-0.15-54.54l-0.59,0.29l-0.64-1.31l1.23-0.6l-0.01-4.54l-0.33-122.47l-0.99,0.18 l-0.28-1.43l1.27-0.23l-0.4-147.49l-0.87-0.16l0.28-1.43l0.58,0.1l-0.35-127.48l-0.13-0.06l0.64-1.31L489.97,76.8l0.73,0.19 l-0.04,0.14l132.63,65.11l0.33-0.45l1.16,0.88l-0.16,0.22l114.21,56.07l0.45-0.35l0.72,0.93l47.89,23.51l2.76-1.36l0.56,4.61 l-3.32-1.63L571.52,330.88L375.95,482.93l0.66,239.95l51.12,243.57l222.53,107.83l236.23,60.93l2.27-1.77 M375.8,425.34l17.25-8.47 l36.13-127.75l-53.73,9.66L375.8,425.34z M551,241.05l38.19-52.2l-123.83-22.27l-34.13,120.68l98.99-17.81L551,241.05z M532.3,269.09l151.34-27.22l37.63-29.25l-130.48-23.47L532.3,269.09z M303.38,733.9l-2.36-4.48l-44.18-83.78L182.5,747.25 l40.78,36.46l52.69,47.11L303.38,733.9z M277.18,831.91l56.95,50.93L375.69,920l-0.13-49.23l-71.19-135L277.18,831.91z M303.96,731.86l41.93-148.25l-9.74-46.39L257.8,644.33L303.96,731.86z M304.94,733.73l9.55,18.12l61.05,115.78l-0.39-144.6 l-16.9-80.53l-11.71-55.81L304.94,733.73z M375.21,211.79l0.23,85.51l54.17-9.74l34.29-121.23l-88.87-15.98L375.21,211.79z M430.78,288.83l-17.88,63.21L394.81,416l44.01-21.6l90.15-123.23L430.78,288.83z M287.76,898.62l87.99,42.64l-0.05-19.29 l-91.37-81.71l-7.59-6.78l-14.88,52.59L287.76,898.62z M174.26,843.62l86.26,41.8l15-53.03l-93.89-83.95l-53.34,72.91L174.26,843.62 z M113.18,687.22L12.71,765.33l55.69,26.99l58.56,28.38l53.58-73.24l-34.83-31.14L113.18,687.22z M230.62,595.92l-116.27,90.4 l63.02,56.36l4.03,3.61l74.67-102.08l-7.47-14.17L230.62,595.92z M331.94,517.15l-100.15,77.86l25.25,47.88l78.71-107.59l-1.71-8.14 L331.94,517.15z M333.22,516.15l2.02,9.64l1.66,7.92l34.65-47.37L333.22,516.15z M337.31,535.63l9.43,44.95l26.67-94.3 L337.31,535.63z M347.39,583.66l27.74,132.16l-0.62-228.04L347.39,583.66z M374.7,21.83l0.35,127.02l89.27,16.06l24.61-87 L374.7,21.83z M490.25,78.56l-22.26,78.7l-2.24,7.91l124.39,22.37l10.23-13.99l22.04-30.12L490.25,78.56z M623.74,144.09 l-12.29,16.8l-19.71,26.95l131.07,23.58l14.73-11.45L623.74,144.09z M739,200.67l-13.3,10.34l-0.96,0.74l58.14,10.46L739,200.67z M723.19,212.96l-25.33,19.69l-11.14,8.66l97.03-17.45L723.19,212.96z M782.89,225.5l-98.64,17.74l-107.06,83.23L782.89,225.5z M631.68,282.26l49.48-38.47l-150.1,27l-89.41,122.22l129.1-63.37L631.68,282.26z M565.06,334.05l-125.28,61.5l-45.94,62.8 l-14.96,20.44L565.06,334.05z M425.31,412.87l11.65-15.93l-42.69,20.96l-13.66,48.3l-3.58,12.67L425.31,412.87z M392.51,418.76 l-16.71,8.2l0.01,4.72l0.12,45.68L392.51,418.76z M377.21,941.96l21.37,10.36l24.14,11.7l-45.56-40.74L377.21,941.96z M377.15,921.31l34.83,31.15l12.57,11.24l-47.53-90.14L377.15,921.31z M376.63,730.07l0.38,140.33l48.29,91.59L376.63,730.07z M806.29,1197.48l75.8-58.86l-28.56,11.47l-25.6,10.28l14.96,7.25l-0.64,1.31l-16.16-7.83l-124.76,50.1l40.56,36.27L806.29,1197.48z M522.43,1146.18l58.88,111.66l52.71-21.17l64.61-25.95l-75.11-67.17L522.43,1146.18z M621.92,1142.14l-115.78-103.53l-46.8-12.07 l62.33,118.2l7.06-0.18L621.92,1142.14z M700.14,1210.12l124.19-49.87l-42.89-20.78l-155.8,4.04L700.14,1210.12z M679.7,1295.77 l61.03-47.39l-40.9-36.57l-117.85,47.32l42.09,79.82L679.7,1295.77z M522.48,1417.85l1.83-1.42l98.6-76.56l-42.28-80.19 l-84.25,33.83L522.48,1417.85z M496.08,1292.06l83.87-33.68l-59.14-112.16l-55.04,1.43L496.08,1292.06z M465.46,1146.2l54.58-1.42 l-62.61-118.74l-18.03-4.65l0.36-1.41l16.74,4.32l-27.63-52.4L465.46,1146.2z M458.42,1024.79l45.35,11.7l-74.14-66.29 L458.42,1024.79z M431.46,969.87l75.38,67.41l136.26,35.15L431.46,969.87z M649.76,1075.65l-140.54-36.25l114.83,102.68l154.53-4.01 L649.76,1075.65z M656.92,1077.5l124.84,60.5l51.97-1.35l47.7-1.24L656.92,1077.5z M784.62,1139.38l41.54,20.13l56.45-22.67 L784.62,1139.38z'/%3E %3C/svg%3E");
		background-position: 25% 50%;
		background-repeat: repeat-y;
		background-size: 40rem auto;*/
	}

	#wrapper section header * {
		/*max-width: 25rem;*/
	}

	#wrapper section header :last-child {
		margin-bottom: 0;
	}

	#wrapper section header:before, #wrapper section header:after {
		/*display: none !important;*/
	}

	#wrapper section header h1:before, #wrapper section header h2:before {
		/*display: none !important;*/
	}

	#wrapper section header h1:after, #wrapper section header h2:after {
		/*display: none !important;*/
	}

	#wrapper section .content :last-child {
		margin-bottom: 0;
	}

	#wrapper section .content section {
		left: 0;
	}

	#wrapper section .content section:first-child {
		margin-top: 0;
	}

	#wrapper section .content section header {
		width: 100%;
	}

	#wrapper section .content section:last-child {
		margin-bottom: 0;
	}

	#wrapper > section footer:last-child {
		margin-bottom: 0;
	}

	#wrapper > section.intro {
		margin-bottom: 0;
	}

	#wrapper > section.intro > header {
		margin-bottom: 0;
	}

	#wrapper > section.intro > header ul.actions {
		display: none;
	}

	#wrapper > section.intro > header > * {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}

	#wrapper > section.intro > header > ul.actions {
		margin-left: -1rem;
	}

	#wrapper > section.intro > header:before {
		margin-left: 0;
	}

	#wrapper section:last-of-type header:after {
		display: none;
	}

	#wrapper .copyright {
		left: 0;
		width: 100%;
	}

	#wrapper section {
		margin: 6rem 0 0 0;
	}

	#wrapper section {
		margin: 0;
	}

	#wrapper section header {
		padding: 4rem 4rem;
	}

	#wrapper section .content {
		padding: 4rem 4rem;
	}

	#wrapper section .content section {
		margin: 4rem 0;
	}

	#wrapper section footer {
		/*padding: 0 4rem 4rem 4rem;*/
	}

	#wrapper section.intro header {
		padding: 8rem 4rem 5rem 4rem;
	}

	#wrapper .copyright {
		padding: 0 4rem 4rem 4rem;
	}

}

@media screen and (max-width: 736px) {

	#wrapper section {
		margin: 3rem 0 0 0;
	}

	#wrapper section {
		margin: 0;
	}

	#wrapper section header {
		padding: 3rem 2rem;
	}

	#wrapper section .content {
		padding: 3rem 2rem;
	}

	#wrapper section .content section {
		margin: 3rem 0;
	}

	#wrapper section footer {
		/*padding: 0 2rem 3rem 2rem;*/
	}

	#wrapper section.intro header {
		padding: 5.5rem 2rem 2.5rem 2rem;
	}

	#wrapper .copyright {
	padding: 0 2rem 2rem 2rem;
	}

}

@media screen and (max-width: 360px) {

	#wrapper section {
		margin: 2.25rem 0 0 0;
	}

	#wrapper section {
		margin: 0;
	}

	#wrapper section header {
		padding: 2.25rem 1.5rem;
	}

	#wrapper section .content {
		padding: 2.25rem 1.5rem;
	}

	#wrapper section .content section {
		margin: 2.25rem 0;
	}

	#wrapper section footer {
		/*padding: 0 1.5rem 2.25rem 1.5rem;*/
	}

	#wrapper > section.intro > header {
		padding: 4.875rem 1.5rem 1.875rem 1.5rem;
	}

	#wrapper .copyright {
		padding: 0 1.5rem 1.5rem 1.5rem;
	}

}

body.is-mobile #wrapper:before {
	background-attachment: scroll;
	background-position: 50% -3%;
	background-repeat: repeat-y;
	background-size: 150% auto;
}

body.is-mobile #wrapper section header {
	background-attachment: scroll;
	background-position: 25% 50%;
}

body.is-mobile #wrapper section.intro header {
	background-position: 25% 23%;
}

#wrapper:before {
	transition: opacity 1s ease;
}

body.is-preload #wrapper:before {
	opacity: 0;
}

#wrapper > section.intro {
	transition: opacity 1s ease;
	opacity: 1;
}

#wrapper > section.intro > header {
	transition: transform 1s ease;
}

#wrapper > section.intro > .content {
	transition: transform 1s ease;
}

body.is-preload #wrapper > section.intro {
	opacity: 0;
}

body.is-preload #wrapper > section.intro > header {
	transform: translateY(1rem);
}

body.is-preload #wrapper > section.intro > .content {
	transform: translateY(-1rem);
}

@media screen and (max-width: 1280px) {

	#wrapper > section.intro > header > * {
		transition: transform 1s ease, opacity 1s ease;
	}

	body.is-preload #wrapper > section.intro > header {
		transform: none;
	}

		body.is-preload #wrapper > section.intro > header > * {
			transform: translate(-0.5rem);
			opacity: 0;
		}

	body.is-preload #wrapper > section.intro > .content {
		transform: none;
	}

}

body.is-ie #wrapper section {
	display: flex;
	flex-wrap: wrap;
}

body.is-ie #wrapper section > header {
	width: 50%;
}

body.is-ie #wrapper section > .content {
	width: 50%;
}

body.is-ie #wrapper section > footer {
	width: 50%;
	text-align: left;
	margin-left: 50%;
	padding: 5rem;
}

body.is-ie #wrapper > section > .content > section {
	width: 100vw;
}

@media screen and (max-width: 1280px) {

	body.is-ie #wrapper section > footer {
		padding: 4rem;
	}

}

@media screen and (max-width: 699px) {
	#wrapper section header:before, #wrapper section header:after {
		display: none !important;
	}

	#wrapper section header h1:before, #wrapper section header h2:before {
		display: none !important;
	}

	#wrapper section header h1:after, #wrapper section header h2:after {
		display: none !important;
	}
}
@media screen and (min-width: 1283px) and (max-width: 1479px) {
	div#block-contact section header h2 {
		font-size: 32px !important;
	}
}
@media screen and (min-width: 1144px) and (max-width: 1416px) {
	.nav-block .cxl-content-main p {
	    font-size: 40px !important;
	}
}
@media screen and (min-width: 1153px) and (max-width: 1283px) {
	div#block-contact section header h2 {
		font-size: 28px !important;
		margin: 0 0 5rem 0 !important;
	}
}
@media screen and (min-width: 1085px) and (max-width: 1299px) {
	div#block-contact section .content p {
	    max-width: 445px !important;
	    width: 100%;
	}
	div#block-contact section .content {
	    margin-left: 3em !important;
	}
}
@media screen and (min-width: 992px) and (max-width: 1153px) {
	div#block-contact section header h2 {
		font-size: 22px !important;
		margin: 0 0 5rem 0 !important;
	}
}
@media screen and (min-width: 992px) and (max-width: 1144px) {
	.nav-block .cxl-content-main p {
	    font-size: 32px !important;
	}
}
@media screen and (min-width: 992px) and (max-width: 1023px) {
	div#block-contact section footer ul li, div#block-contact section footer ul li a {
		font-size: 15px !important;
	}
}
@media screen and (min-width: 992px) and (max-width: 1100px) {
	div#block-contact section .content .field .enq {
	    width: 125px !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
		width: 122px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
	    font-size: 15px !important;
	}
	div#block-contact section .content {
	    margin-left: 3em !important;
	}
}
@media screen and (max-width: 991px) {
	div#block-contact section header h2 {
		font-size: 28px !important;
		margin: 0 0 5rem 0 !important	;
	}
	div#block-contact section .content .field input.input-enq, 
	div#block-contact section .content .field textarea.input-enq {
	    max-width: 620px !important;
	}
	div#block-contact section .content {
	    margin-left: 2.6em !important;
		border: solid;
		border-width: .15em 0 0 0;
		width: 100%;
		border-image: linear-gradient(to right, #00b4a8, rgba(0, 0, 0, 0)) 1 0;
		margin-top: 1em;
		padding-top: 2em !important;
	}
}

@media screen and (max-width: 992px) {
	body.it-enabled .it-mob {
		display: block !important;
	}
	body.it-enabled .it-desk {
		display: none !important;
	}
	div#block-it section p {
		text-align: left !important;
	}
}
body.it-enabled .it-mob {
	display: none;
}
body.it-enabled .it-desk {
	display: block;
}
/* ---------- media query -----------*/
@media only screen and (min-device-width : 280px) and (max-device-width : 653px) and (orientation : landscape) {
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .xtal-main .nav-block .uxl-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-97px) translateZ(0) !important;
	    transform: translateX(-97px) translateZ(0) !important;
	}
	.xtal-main .nav-block .uxl-block .cxl-social-contact::after {
	    height: 40px !important;
	    top: 23px !important;
	}
}
@media only screen and (min-device-width : 280px) and (max-device-width : 653px) and (orientation : portrait) {
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
	.nav-block .xt-logo img {
	    min-width: 150px !important;
	}
	.nav-block .contact-icon svg {
	    margin-top: 10px;
	    width: 40px !important;
	    height: 40px !important;
	}
	.nav-block .cxl-shop-message:hover .t-content {
	    width: 125px !important;
	}
	.nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
	    width: 145px !important;
	}
	.xtal-main .nav-block .uxl-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-66px) translateZ(0) !important;
	    transform: translateX(-66px) translateZ(0) !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
	    left: 19px !important;
	}
	.cxl-social-contact {
	    left: 18px !important;
	}
	.nav-block .cxl-arrow.cxl-arrow--left {
	    left: 5px !important;
	}
	.nav-block .cxl-arrow.cxl-arrow--right {
	    right: 5px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 19px !important;
	    padding: 0 1em !important;
	}
	.cxl-content-main {
	    height: 184px !important;
	}
	#blmain-canvas-block {
	    opacity: 0.2 !important;
	}
	.cxl-content-main .cxl__heading {
	    opacity: 0.2 !important;
	    font-size: 18vw !important;
	}

	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 17px !important;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 13px !important;
	}
	div#block-contact section .content p {
	    font-size: 13px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 13px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 13px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
	    width: 165px !important;
	}
	div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	.field.fenq {
	    margin-bottom: 3em !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 10px !important;
	}
	div#block-contact section .head-content {
    	padding-right: 1em;
    }
    .contact-enabled .slider-main.bl-click-contact {
	    margin-left: 60px !important;
	    margin-right: 0px !important;
	}
	div#block-contact section .content {
	    margin-left: 0 !important;
	}
	input[type="radio"] + label:before {
	    width: 10px !important;
	    height: 10px !important;
	}
	div#block-contact section .content .sales label, div#block-contact section .content .support label {
	    padding: 0 0 0 1.5rem !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
	    width: 100px !important;
	}
	.js-validate-error-label {
    	font-size: 12px !important;
    }
    /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 5em;
	}
	.slider-main.bl-click-right {
	    margin-left: 74px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 18px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 16px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 14px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 12px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 12px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
		max-width: 28em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 7em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}
/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .xtal-main .nav-block .cxl-shop-message:hover {
    	left: 48% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.xtal-main .nav-block .cxl-social-contact::after {
		height: 60px !important;
		top: -1px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 20px !important;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 15px !important;
	}
	div#block-contact section .content p {
	    font-size: 15px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 15px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 15px !important;
	}
	/*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 4em;
	}
	.slider-main.bl-click-right {
	    margin-left: 100px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 20px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 18px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 16px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 14px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 14px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
    	max-width: 49em;
    	padding-left: 11em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 7em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 42% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 59% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 20px !important;
	}
	div#block-contact section .head-content {
	    padding-right: 15px;
	    margin-left: 15px;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 14px !important;
	}
	.bl-click-contact {
	    margin-left: 70px !important;
	}
	div#block-contact section .content {
	    margin-left: 10px !important;
	}
	div#block-contact section .content p {
	    font-size: 14px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 14px !important;
	}
	input[type="radio"] + label:before {
	    width: 10px !important;
	    height: 10px !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
    	width: 115px !important;
    }
    div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	div#block-contact form.fcf-form-class {
	    margin-top: 3em !important;
	}
	div#block-contact section .content .field .enq {
	    margin-bottom: 5px;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
	    margin-bottom: 3em !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 14px !important;
	}
	div#block-contact section .content .field textarea.input-enq {
		/*padding-top: 40px !important;*/
	}
	div#block-contact section .content textarea + label.label-enq {
	    top: -11em;
	}
	/*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 5em;
	}
	.slider-main.bl-click-right {
	    margin-left: 76px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 20px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 18px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 16px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 14px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 14px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
		max-width: 28em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}

	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 7em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}
/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	    margin-top: -22px !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	.xtal-main .nav-block .cxl-social-contact::after {
	    top: 16px !important;
	    height: 45px !important;
	}
	.xtal-main .nav-block .cxl-shop-message:hover {
	    left: 47% !important;
	}

	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 20px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	div#block-contact section .content .field input {
	    margin-bottom: ;
	    margin-left: -10px !important;
	}
	div#block-contact section .content .field.fenq {
	    margin-bottom: 3em !important;
	}
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 40% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 40% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px .7em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.nav-block .cxl-shop-message:hover .t-content {
    	width: 139px !important;
    }
    .nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
	    width: 159px !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 17px !important;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 13px !important;
	}
	div#block-contact section .content p {
	    font-size: 13px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 13px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 13px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
	    width: 165px !important;
	}
	div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	.field.fenq {
	    margin-bottom: 3em !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 10px !important;
	}
	div#block-contact section .head-content {
    	padding-right: 1em;
    }
    .contact-enabled .slider-main.bl-click-contact {
	    margin-left: 70px !important;
	}
	div#block-contact section .content {
	    margin-left: 0 !important;
	}
	input[type="radio"] + label:before {
	    width: 10px !important;
	    height: 10px !important;
	}
	div#block-contact section .content .sales label, div#block-contact section .content .support label {
	    padding: 0 0 0 1.5rem !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
	    width: 100px !important;
	}
	.js-validate-error-label {
    	font-size: 12px !important;
    }
    /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 5em;
	}
	.slider-main.bl-click-right {
	    margin-left: 76px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 20px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 18px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 16px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 14px;
	}
	.ec-enabled #block-ec p,
	.ec-enabled #block-port p {
		font-size: 14px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
		max-width: 28em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 7em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}
/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .xtal-main .nav-block .cxl-shop-message:hover {
    	left: 47% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.xtal-main .cxl-content-main .cxl__heading {
		top: 67% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.xtal-main .nav-block .cxl-social-contact::after {
		height: 50px !important;
		top: 10px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}

	/*-----contact-------*/
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	.field.fenq {
	    margin-bottom: 3em !important;
	}
	div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 40% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 66% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px .7em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.nav-block .cxl-shop-message:hover .t-content {
    	width: 139px !important;
    }
    .nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
	    width: 159px !important;
	}
}

/* iPhone 6, 7, 8 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 42% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 59% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
}

/* Nexus ----------- */
@media only screen and (min-device-width: 411px) and (max-device-height: 823px) and (orientation : landscape) {
	.nav-block .cxl-social-contact::after {
	    /*top: -2px !important;
	    height: 60px !important;*/
	}
}
@media only screen and (min-device-width: 411px) and (max-device-height: 731px) and (orientation : landscape) {
	.nav-block .cxl-social-contact::after {
	    top: 28px !important;
	    height: 60px !important;
	}
}
@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : landscape) {
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		top: 38px !important;
	    height: 50px !important;
	}
	.nav-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-100px) translateZ(0) !important;
	    transform: translateX(-100px) translateZ(0) !important;
	}
	    /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 4em;
	}
	.slider-main.bl-click-right {
	    margin-left: 120px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 20px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 18px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 16px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 14px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 14px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 11em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}

@media only screen and (min-device-width: 412px) and (max-device-height: 732px) and (orientation : portrait) {
	.nav-block .cxl-content-main {
	    height: 148px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		top: 38px !important;
	    height: 50px !important;
	}
	.nav-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-155px) translateZ(0) !important;
	    transform: translateX(-155px) translateZ(0) !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 20px !important;
	}
	div#block-contact section .head-content {
	    padding-right: 15px;
	    margin-left: 15px;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 14px !important;
	}
	.bl-click-contact {
	    margin-left: 70px !important;
	}
	div#block-contact section .content {
	    margin-left: 10px !important;
	}
	div#block-contact section .content p {
	    font-size: 14px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 14px !important;
	}
	input[type="radio"] + label:before {
	    width: 10px !important;
	    height: 10px !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
    	width: 115px !important;
    }
    div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	div#block-contact form.fcf-form-class {
	    margin-top: 3em !important;
	}
	div#block-contact section .content .field .enq {
	    margin-bottom: 5px;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
	    margin-bottom: 3em !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 14px !important;
	}
	div#block-contact section .content .field textarea.input-enq {
		/*padding-top: 40px !important;*/
	}
	div#block-contact section .content textarea + label.label-enq {
	    top: -11em;
	}
	div#block-contact section .content .field .enq {
    	width: 100% !important;
    }
    /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -25px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 4em;
	}
	.slider-main.bl-click-right {
	    margin-left: 100px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 20px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 18px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 16px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 14px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 14px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
    	max-width: 31em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 7em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 20px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 16px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}

/* iPhone 6+, 7+, 8+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 42% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 59% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
}
	
/* iPhone X ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	/*----ec block -----*/
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
	    width: 100%;
	    padding-left: 5em;
	    max-width: 63em;
	}
}

@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 40% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 59% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
}

/* iPhone XS Max, XR ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	    margin-bottom: -16px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -27px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 26px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
}

@media only screen and (min-device-width: 414px) and (max-device-height: 896px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 1.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 2em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 2em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: .5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: .5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 1.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 40% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 59% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 200px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 25px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 46% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
}

@media only screen and (min-device-width : 540px) and (max-device-width : 720px) and (orientation : landscape) {
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .xtal-main .nav-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-84px) translateZ(0) !important;
	    transform: translateX(-84px) translateZ(0) !important;
	}
}
@media only screen and (min-device-width : 540px) and (max-device-width : 720px) and (orientation : portrait) {
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .xtal-main .nav-block .cxl-shop-message:hover {
	    -webkit-transform: translateX(-84px) translateZ(0) !important;
	    transform: translateX(-84px) translateZ(0) !important;
	}
	/*--ec block----*/
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
	    width: 100%;
	    max-width: 42em;
	}
}
/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	    margin-bottom: -10px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -20px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 45px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 16% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	.nav-block .contact-icon svg {
	    margin-top: 10px !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 22px !important;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 18px !important;
	}
	div#block-contact section .content p {
	    font-size: 18px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 18px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 18px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
	    width: 165px !important;
	}
	div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	.field.fenq {
	    margin-bottom: 3em !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 16px !important;
	}
	 /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 4em;
	}
	.slider-main.bl-click-right {
	    margin-left: 120px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 27px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 25px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 22px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 20px;
	}
	.ec-enabled #block-ec p,
	.ec-enabled #block-port p {
		font-size: 20px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		/*width: 80%;*/
    	padding-left: 5em;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 100px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 11em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 22px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 18px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 129px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 38px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 48% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}

	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 25px !important;
	}
	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 18px !important;
	}
	div#block-contact section .content p {
	    font-size: 18px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 18px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 18px !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 16px !important;
	}
	    /*-----------ec block------------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.ec-enabled .bl-click-right {
	    margin-top: 4em;
	}
	.slider-main.bl-click-right {
	    margin-left: 120px;
	}

	#wrapper #block-ec section.xt-about,
	#wrapper #block-port section.xt-about {
	    margin-top: 5em;
	}
	#wrapper #block-ec section.xt-services,
	#wrapper #block-port section.xt-services {
	    margin-top: 2em;
	}
	#block-ec section.xt-clients {
	    margin-top: 3em !important;
	    margin-bottom: 3em;
	}

	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 27px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 25px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 22px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 20px;
	}
	.ec-enabled #block-ec p,
	.port-enabled #block-port p {
		font-size: 20px;
		letter-spacing: 2px;
	}
	#block-ec .is-visible h3.service-title, 
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
	    transform: translate(0%, -25%);
	}
	
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
		width: 100%;
	}
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 65px;*/
	}
	.xt-clients__link img {
		max-width: 10em !important;
	}
	section.xt-services .o-three-quarters.-xt-animate.animate-fadeInBottomRight.-xt-animate-fadeInBottomRight {
	    animation: none;
	}
	/*-----it-block----*/
	.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	.slider-main.bl-click-left {
	   margin-right: 11em;
	}
	.is-visible .xt-about__heading {
	    margin-bottom: 0;
	}
	#block-it section.xt-web {
	    margin-top: 4em;
	}
	div#block-it section h1 {
	    font-size: 22px !important;
	    margin-bottom: 15px;
	}
	div#block-it section p {
    	font-size: 18px !important;
    }
    div#block-it {
	    margin-bottom: 2em;
	}
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	    margin-bottom: -10px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -20px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 136px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 45px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 38% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	.nav-block .contact-icon svg {
	    margin-top: 10px !important;
	}
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 129px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 38px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 48% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	    margin-bottom: -10px !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 44% !important;
    	margin-bottom: -20px !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 52% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 100px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 55px !important;
	    padding: 0px 1.5em !important;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 42% !important;
	    opacity: 0.2 !important;
	    font-size: 17vw !important;
	    height: 250px !important;
	}
	.cxl-social-contact::after {
		height: 60px !important;
	}
	.cxl-social-contact {
		padding: 72px 0 0 0 !important;
	}
	.nav-block .contact-icon svg {
	    margin-top: 10px !important;
	}
	.nav-block .cxl-shop-message:hover .t-content {
	    font-size: 18px !important;
	}
	.nav-block .cxl-shop-message .cxl-shop-message__triangle {
	    /*width: 10px !important;
	    height: 10px !important;
	    left: 43% !important;
	    top: 44% !important;*/
	}
	.nav-block .cxl-shop-message .cxl-shop-message__circle,
	.nav-block .cxl-port .cxl-port__circle {
	    width: 35px !important;
	    height: 35px !important;
	    border-radius: 50px !important;
	    top: 0px !important;
	}
	.nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
	    width: 200px !important;
	}
	.nav-block .cxl-shop-message .cxl-shop-message__text,
	.nav-block .cxl-port .cxl-port__text {
	    font-size: 15px !important;
	}
	.nav-block .cxl-arrow--left .cxl-arrow-message__text,
	.nav-block .cxl-arrow--right .cxl-arrow-message__text {
	    font-size: 15px !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 32px !important;
	}

	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 22px !important;
	}
	div#block-contact section .content p {
	    font-size: 22px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 22px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 22px !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 22px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 156px !important;
	}
	.field.fenq {
	    margin-bottom: 2em !important;
	}
	div#block-contact section .content .field .sales, div#block-contact section .content .field .support {
    	width: 150px !important;
    }
    div#block-contact section .content .field .sales > input[type="radio"] + label {
    	margin-bottom: 2em !important;
    }
    input[type="radio"] + label:before {
	    width: 10px !important;
	    height: 10px !important;
	    top: 2.2em !important;
	}
	/*-----ec block----------*/
	.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo, 
	.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	    margin-top: -40px;
	}
	#block-ec .xt-services .xt-skills__item:nth-child(2n-1) {
	    padding: 58px 48px 58px 85px;
	}
	#block-port .xt-services .xt-skills__item:nth-child(2n-1) {
		padding: 0;
	}
	#block-ec .xt-services .xt-skills__item:nth-child(2n) {
	    padding: 58px 0 58px 112px;
	}
	#block-port .xt-services .xt-skills__item:nth-child(2n) {
		padding: 0;
	}

	#block-ec .xt-services .o-three-quarters,
	#block-port .xt-services .o-three-quarters {
	    width: 100%;
	    padding-left: 16em;
	}
	#block-ec .xt-clients .o-three-quarters {
	    width: 100%;
	    padding-left: 16em;
	}
}

@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
	.nav-block .cxl-mirror-slideshow__ui.is-visible {	    
	    padding: 2.5em !important;
	}
	.nav-block .xt-logo img {
	    min-width: 250px !important;
	}
	.nav-block .cxl-arrow.cxl-logo--left {
    	left: 3.5em !important;
    }
    .nav-block .cxl-arrow.cxl-contact--right {
	    right: 3em !important;
	}
    .nav-block .cxl-arrow.cxl-arrow--left {
    	left: 1.5em !important;
    }
    .nav-block .cxl-arrow.cxl-arrow--right {
	    right: 1.5em !important;
	}
    .nav-block .cxl-social-contact {
	    left: 2.3em !important;
	}
	.nav-block .cxl-shop-message,
	.nav-block .cxl-port {
    	left: 45% !important;
    }
    .nav-block .cxl-shop-message:hover {
    	left: 49% !important;
    }    
	.nav-block .cxl-content-main {
	    height: 129px !important;
	}
	.nav-block .cxl-content-main p {
	    font-size: 50px !important;
	    padding: 0px 1.5em;
	}
	#blmain-canvas-block {
	    opacity: 0.3 !important;
	}
	.cxl-content-main .cxl__heading {
		top: 30% !important;
		opacity: 0.3 !important;
		font-size: 17vw !important;
	}
	.nav-block .contact-icon svg {
	    width: 70px !important;
	    height: 70px !important;
	}
	.nav-block .c-arrow__mode {
	    width: 60px !important;
	    height: 60px !important;
	}
	.c-arrow__icon {
	    margin-top: 0.875rem !important;
	}
	.nav-block .cxl-arrow--left .cxl-arrow-message__text {
	    -webkit-transform: translate(67px, 22px) !important;
	    transform: translate(67px, 22px) !important;
	    font-size: 25px !important;
	}
	.nav-block .cxl-arrow--right .cxl-arrow-message__text {
	    -webkit-transform: rotateY(180deg) translate(-54px, 22px) !important;
	    transform: rotateY(180deg) translate(-54px, 22px) !important;
	    font-size: 15px !important;
	}
	svg.whatsapp_cls {
	    width: 45px !important;
	    height: 45px !important;
	}
	#cxl-social-contactPort svg.whatsapp_cls {
	    width: 32px !important;
	    height: 32px !important;
	}
	.cxl-social-contact::after {
	    left: 67% !important;
	}
	.nav-block .cxl-shop-message .cxl-shop-message__text,
	.nav-block .cxl-port .cxl-port__text {
	    font-size: 15px !important;
	}
	.nav-block .cxl-shop-message .cxl-shop-message__triangle,
	.nav-block .cxl-port .cxl-port__triangle {
	    width: 16px !important;
	    height: 10px !important;
	}
	.nav-block .cxl-shop-message .cxl-shop-message__circle,
	.nav-block .cxl-port .cxl-port__circle {
	    border-radius: 50px !important;
	    width: 45px !important;
	    height: 45px !important;
	    top: -3px !important;
	}
	.nav-block .cxl-shop-message:hover .t-content {
	    width: 234px !important;
	}
	.nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
        width: 250px !important;
	    height: 50px;
	    border-radius: 50px !important;
	    border: 1px solid #fff;
	    top: -8px !important;
	}
	/*-----contact-------*/
	div#block-contact section header h2 {
	    font-size: 24px !important;
	}

	div#block-contact section footer ul li, div#block-contact section footer ul li a span {
	    font-size: 20px !important;
	}
	div#block-contact section .content p {
	    font-size: 20px !important;
	}
	div#block-contact section .content .field, div#block-contact section .content .fcf-status, div#block-contact section .content .field .sales > input[type="radio"] + label, div#block-contact section .content .field .support > input[type="radio"] + label {
		font-size: 20px !important;
	}
	div#block-contact section .content .field input, div#block-contact section .content .field textarea {
	    font-size: 20px !important;
	}
	div#block-contact section footer ul li a.ftel span {
	    font-size: 16px !important;
	}
	div#block-contact section .content .field .enq {
	    width: 100% !important;
	}
	div#block-contact section .content .field input {
	    margin-left: -10px !important;
	}
	.field.fenq {
	    margin-bottom: 3em !important;
	}
	/*ec block*/
	#block-ec .xt-skills__item,
	#block-port .xt-skills__item {
	    /*padding: 20px 0 40px 100px;*/
	}
}
@media only screen and (min-device-width : 1200px) and (max-device-width : 1570px) {
	.ec-enabled .slider-main {
		/*padding-bottom: 5em;*/
	}
	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 38px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 30px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 25px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 20px;
	}
	.ec-enabled #block-ec .xt-services p,
	.port-enabled #block-port .xt-services p {
		font-size: 15px;
		letter-spacing: 2px;
	}
	.ec-enabled #block-ec .xt-about p,
	.port-enabled #block-port .xt-about p {
		font-size: 20px;
		letter-spacing: 2px;
	}
	#block-ec .o-three-quarters,
	#block-port .o-three-quarters {
	    width: 100%;
	    padding-left: 18em;
	}
}

@media only screen and (min-device-width : 998px) and (max-device-width : 1200px) {
	.ec-enabled .slider-main {
		padding-bottom: 5em;
	}
	#block-ec article h3.xt-about__heading,
	#block-port article h3.xt-about__heading {
	    font-size: 38px;
	    margin-bottom: 2px;
	    line-height: 1.5;
	}
	#block-ec .is-visible h3.service-title,
	#block-ec .is-visible h3.client-title,
	#block-port .is-visible h3.service-title {
		font-size: 30px;
	}
	section.xt-services .xt-title-stroke h3,
	section.xt-clients .xt-title-stroke h3 {
	    font-size: 25px;
	}
	#block-ec .xt-skills__item h3.xt-skills__title,
	#block-port .xt-skills__item h3.xt-skills__title {
	    font-size: 20px;
	}
	.ec-enabled #block-ec .xt-services p, 
	.port-enabled #block-port .xt-services p {
		font-size: 15px;
		letter-spacing: 2px;
	}
	.ec-enabled #block-ec .xt-about p,
	.port-enabled #block-port .xt-about p {
		font-size: 20px;
		letter-spacing: 2px;
	}
	
}
/* ---------- custom code -----------*/
html {
  --scrollbarBG: linear-gradient(0deg, #020815 0%, #020815 78%);
  --thumbBG: linear-gradient(0deg, #020815 0%, #020815 78%);
}
body::-webkit-scrollbar {
    width: 0.3em;
}
body {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
body::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
  -webkit-box-shadow: inset 0 0 6px linear-gradient(0deg, #000718 0%, #01303c 78%);
}
body::-webkit-scrollbar-thumb {
  background: rgb(43,217,215);
  background: linear-gradient(0deg, rgba(43,217,215,1) 0%, rgba(16,91,110,1) 78%);
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}
.nav-block .contact-icon svg {
    margin-top: 10px;
}
div#block-contact section .content textarea::-webkit-scrollbar {
  width: 0.2em;
  background-color: #F5F5F5; }
div#block-contact section .content textarea {
	resize: none;
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
div#block-contact section .content textarea::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
  -webkit-box-shadow: inset 0 0 6px linear-gradient(0deg, #000718 0%, #01303c 78%);
}

div#block-contact section .content textarea::-webkit-scrollbar-thumb {
  background: rgb(43,217,215);
  background: linear-gradient(0deg, rgba(43,217,215,1) 0%, rgba(16,91,110,1) 78%);
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG); }


#wrapper {
    height: 100%;
    overflow: hidden;
}

/*--pre-loader--*/

body .pre-loader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
}
body .pre-loader .vertical-centered-box {
	position: absolute;
	width: 100%;
	height: 100%;
	text-align: center;
}
body .pre-loader .vertical-centered-box:after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.25em;
}
body .pre-loader .vertical-centered-box .content {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	font-size: 0;
}
.pre-loader .loader-circle {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
	margin-left: -60px;
	margin-top: -60px;
}
.pre-loader .loader-line-mask {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 60px;
	height: 120px;
	margin-left: -60px;
	margin-top: -60px;
	overflow: hidden;
	-webkit-transform-origin: 60px 60px;
	-moz-transform-origin: 60px 60px;
	-ms-transform-origin: 60px 60px;
	-o-transform-origin: 60px 60px;
	transform-origin: 60px 60px;
	-webkit-mask-image: -webkit-linear-gradient(top, #000000, rgba(0, 0, 0, 0));
	-webkit-animation: rotate 1.2s infinite linear;
	-moz-animation: rotate 1.2s infinite linear;
	-o-animation: rotate 1.2s infinite linear;
	animation: rotate 1.2s infinite linear;
}
.pre-loader .loader-line-mask .loader-line  {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	box-shadow: inset 0 0 0 1px #00b4a8;
}
.pre-loader #particles-background,
.pre-loader #particles-foreground {
	left: -51%;
	top: -51%;
	width: 202%;
	height: 202%;
	-webkit-transform: scale3d(0.5, 0.5, 1);
	-moz-transform: scale3d(0.5, 0.5, 1);
	-ms-transform: scale3d(0.5, 0.5, 1);
	-o-transform: scale3d(0.5, 0.5, 1);
	transform: scale3d(0.5, 0.5, 1);
}
.pre-loader #particles-background {
	background: #00b4a8;
	background-image: -moz-linear-gradient(45deg, #01262f 2%, #020815 100%);
	background-image: -webkit-linear-gradient(45deg, #01262f 2%, #020815 100%);
	background-image: linear-gradient(45deg, #01262f 2%, #020815 100%)
}
lesshat-selector { -lh-property: 0; } 
@-webkit-keyframes rotate{ 0% { -webkit-transform: rotate(0deg);} 100% { -webkit-transform: rotate(360deg);}}
@-moz-keyframes rotate{ 0% { -moz-transform: rotate(0deg);} 100% { -moz-transform: rotate(360deg);}}
@-o-keyframes rotate{ 0% { -o-transform: rotate(0deg);} 100% { -o-transform: rotate(360deg);}}
@keyframes rotate{ 0% {-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);transform: rotate(360deg);}}
[not-existing] {
  zoom: 1;
}
lesshat-selector { -lh-property: 0; } 
@-webkit-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@-moz-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@-o-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
[not-existing] {
  zoom: 1;
}
lesshat-selector { -lh-property: 0; } 
@-webkit-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@-moz-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@-o-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
[not-existing] {
  zoom: 1;
}

/*--nav box--*/		

.nav-block .cxl-mirror-slideshow__ui.is-visible {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition-delay: 0s, 0s;
    -o-transition-delay: 0s, 0s;
    transition-delay: 0s, 0s;
    overflow: hidden;
    z-index: 99;
}
.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo,
.ec-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo,
.it-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible .cxl-content-logo {
	width: 100%;
    height: 100px;
    background: -webkit-gradient(linear, left bottom, right top, from(#01262f), to(#020815)) fixed;
}
.nav-block .uxl-pos-tl
{
    top: 0;
    left: 0;
}
.nav-block .uxl-absolute {
    position: absolute;
}
.nav-block .uxl-fixed {
    position: fixed;
}

.nav-block .uxl-fit {
    width: 100%;
    height: 100%;
}
.nav-block  .cxl-content-main p {
	font-family: 'Cinzel Decorative', cursive;
	font-size: 54px;
	letter-spacing: 12px;
	line-height: 1.5;
	text-align: center;
}
.nav-block .uxl-block {
    display: block;
}
.nav-block .cxl-mirror-slideshow__ui {
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity 0.3s, visibility 0s 0.3s;
    -o-transition: opacity 0.3s, visibility 0s 0.3s;
    transition: opacity 0.3s, visibility 0s 0.3s;
    will-change: opacity;
}

.nav-block .cxl-arrow.cxl-arrow--left 
{
    left: 30px;
    /*margin-left: -40px;*/
}
.nav-block .cxl-arrow 
{
    top: 50%;
    width: 80px;
    height: 80px;
    margin-top: -40px;
    font-size: 16px;
    font-size: 1rem;
    text-align: center;
    line-height: 50px;
    border: none;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity 0.5s cubic-bezier(0.5, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(0.5, 0, 0, 1);
    transition: opacity 0.5s cubic-bezier(0.5, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(0.5, 0, 0, 1);
    -o-transition: transform 0.5s cubic-bezier(0.5, 0, 0, 1), opacity 0.5s cubic-bezier(0.5, 0, 0, 1);
    transition: transform 0.5s cubic-bezier(0.5, 0, 0, 1), opacity 0.5s cubic-bezier(0.5, 0, 0, 1);
    transition: transform 0.5s cubic-bezier(0.5, 0, 0, 1), opacity 0.5s cubic-bezier(0.5, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(0.5, 0, 0, 1);
    will-change: transform, opacity;
    /*z-index: 99;*/
    z-index: 2;
}
.nav-block .u-overflow-h {
    overflow: hidden;
}

.nav-block .c-arrow__mode {
    top: 50%;
    left: 50%;
    width: 47px;
    height: 47px;
    margin-top: -24px;
    margin-left: -24px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    will-change: transform;
    border-radius: 40px;
}
.nav-block .c-arrow__circle {
    border: 2px solid #fff;
    border-radius: 40px;
    opacity: 0.25;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: opacity 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: opacity 0.7s cubic-bezier(1, 0, 0.25, 1);
    will-change: opacity;
}

.nav-block .c-arrow__circle-trigger {
    border: 8px solid #fff;
    border-radius: 40px;
    opacity: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity cubic-bezier(0, 0, 1, 1), -webkit-transform cubic-bezier(0, 0, 1, 1);
    transition: opacity cubic-bezier(0, 0, 1, 1), -webkit-transform cubic-bezier(0, 0, 1, 1);
    -o-transition: transform cubic-bezier(0, 0, 1, 1), opacity cubic-bezier(0, 0, 1, 1);
    transition: transform cubic-bezier(0, 0, 1, 1), opacity cubic-bezier(0, 0, 1, 1);
    transition: transform cubic-bezier(0, 0, 1, 1), opacity cubic-bezier(0, 0, 1, 1), -webkit-transform cubic-bezier(0, 0, 1, 1);
    will-change: transform, opacity;
}
.nav-block .c-arrow__inner {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity, -webkit-transform;
    transition: opacity, -webkit-transform;
    -o-transition: transform, opacity;
    transition: transform, opacity;
    transition: transform, opacity, -webkit-transform;
    will-change: transform, opacity;
}
.nav-block .c-arrow__icon {
    top: calc(50% - 4px);
    left: calc(50% - 4px);
    width: 42px;
    height: 8px;
    -webkit-transform: translateX(0%) translateZ(0);
    transform: translateX(0%) translateZ(0);
    -webkit-transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    will-change: transform;
}
.nav-block .c-arrow__icon-inner {
    -webkit-transform: translateX(0%) translateZ(0);
    transform: translateX(0%) translateZ(0);
    -webkit-transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    will-change: transform;
}
.nav-block .u-inline-block {
    display: inline-block;
}
.nav-block .c-arrow__bar {
    top: 3px;
    left: 1px;
    width: 42px;
    height: 1px;
    background: #fff;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transition: opacity 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: opacity 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    -o-transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), opacity 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), opacity 0.7s cubic-bezier(1, 0, 0.25, 1);
    transition: transform 0.7s cubic-bezier(1, 0, 0.25, 1), opacity 0.7s cubic-bezier(1, 0, 0.25, 1), -webkit-transform 0.7s cubic-bezier(1, 0, 0.25, 1);
    will-change: transform, opacity;
}
.nav-block svg:not(:root) {
    overflow: hidden;
}
.nav-block .u-fill--white {
    fill: #fff;
}
.nav-block .c-arrow__triangle {
    top: 0;
    left: 0;
    width: 4px;
    height: 7px;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}
.nav-block .t-icon--triangle-right {
    width: 4px;
    height: 7px;
}
.nav-block .cxl-arrow.cxl-arrow--right {
    right: 35px;
    /*margin-right: -40px;*/
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}
.nav-block .cxl-arrow:hover .c-arrow__circle {
    opacity: 1;
}
.nav-block .cxl-arrow:hover .c-arrow__icon {
   /* -webkit-transform: translateX(-16px);
    -ms-transform: translateX(-16px);
    transform: translateX(-16px);*/
}
.nav-block .cxl-arrow:hover .c-arrow__bar {
   /* -webkit-transform: scaleX(0.55);
    -ms-transform: scaleX(0.55);
    transform: scaleX(0.55);*/
}
.nav-block .cxl-arrow:hover .cxl-arrow-message__text {
   /* -webkit-transform: scaleX(1) translate(20px, 12px);
    -ms-transform: scaleX(1) translate(20px, 12px);
    transform: scaleX(1) translate(20px, 12px);*/
}
.nav-block .cxl-arrow.cxl-arrow--right:hover .cxl-arrow-message__text {
    /*-webkit-transform: scaleX(1) rotateY(-180deg) translate(-3px, 12px);
    -ms-transform: scaleX(1) rotateY(-180deg) translate(-3px, 12px);
    transform: scaleX(1) rotateY(-180deg) translate(-3px, 12px);*/
}
.nav-block .cxl-shop-message,
.nav-block .cxl-port {
    left: 50%;
    bottom: 50px;
    height: 40px;
    line-height: 40px;
    z-index: 99;
}


.nav-block .cxl-shop-message .cxl-shop-message__text,
.nav-block .cxl-port .cxl-port__text {
    display: inline-block;
    vertical-align: middle;
    padding-right: 3px;
    color: #dcdcdc;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: -webkit-transform 0.15s;
    transition: -webkit-transform 0.15s;
    -o-transition: transform 0.15s;
    transition: transform 0.15s;
    transition: transform 0.15s, -webkit-transform 0.15s;
    will-change: transform;
    font-weight: 600;
    font-size: 15px;
}
.nav-block .cxl-shop-message .cxl-shop-message__icon,
.nav-block .cxl-port .cxl-port__icon {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 34px;
    height: 34px;
}
.nav-block .cxl-shop-message .cxl-shop-message__triangle,
.nav-block .cxl-port .cxl-port__triangle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    margin-top: -5px;
    margin-left: -5px;
}
.nav-block .cxl-shop-message .cxl-shop-message__circle,
.nav-block .cxl-port .cxl-port__circle {
    border: 2px solid #fff;
    border-radius: 17px;
    -webkit-transform: scale(0.85) translateZ(0);
    transform: scale(0.85) translateZ(0);
    -webkit-transition: -webkit-transform 0.15s;
    transition: -webkit-transform 0.15s;
    -o-transition: transform 0.15s;
    transition: transform 0.15s;
    transition: transform 0.15s, -webkit-transform 0.15s;
    will-change: transform;
}
.nav-block .cxl-shop-message:hover {
	-webkit-transform: translateX(-125px) translateZ(0);
	transform: translateX(-125px) translateZ(0);
}
.nav-block .cxl-shop-message:hover .cxl-shop-message__text {
    -webkit-transform: translateX(-3px) translateZ(0);
    transform: translateX(-3px) translateZ(0);

}
.nav-block .cxl-shop-message:hover svg, .t-content {
	opacity: 0;
}
.nav-block .cxl-shop-message:hover .cxl-shop-message__circle {
    -webkit-transform: scale(1) translateZ(0);
    transform: scale(1) translateZ(0);
    width: 200px;
    border: 1px solid #fff;
}
.nav-block .cxl-shop-message:hover .t-content {
	opacity: 1;
	width: 180px;
    padding: 0;
    text-align: center;
    transform: translate(10px, -6px);
}

.nav-block .cxl-arrow.cxl-logo--left 
{
    left: 45px;
    top: 50px;
    width: 50px;
    height: 50px;
    margin: 0;
    margin-top: -40px;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}
.nav-block .cxl-arrow.cxl-contact--right 
{
    right: 45px;
    top: 50px;
    width: 50px;
    height: 50px;
    margin: 0;
    /*right: 2.8%;*/
    margin-top: -40px;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
}

.nav-block .cxl-arrow--right .cxl-arrow-message__text,
.nav-block .cxl-arrow--left .cxl-arrow-message__text {
    display: inline-block;
    vertical-align: middle;
    padding-right: 15px;
    color: #dcdcdc;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: -webkit-transform 0.15s;
    transition: -webkit-transform 0.15s;
    -o-transition: transform 0.15s;
    transition: transform 0.15s;
    transition: transform 0.15s, -webkit-transform 0.15s;
    will-change: transform;
    font-size: 15px;
    font-weight: 600;
}
.nav-block .cxl-arrow--right .cxl-arrow-message__text {
	-webkit-transform: rotateY(180deg) translate(-50px, 12px);
    transform: rotateY(180deg) translate(-50px, 12px);
}
.nav-block .cxl-arrow--left .cxl-arrow-message__text {
	-webkit-transform: translate(62px, 12px);
    transform: translate(62px, 12px);
}
.cxl-content-main {
    width: 100%;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.cxl-content-main p {
	opacity: 0.8;
    font-weight: normal;
    color: #fff;
}
.cxl-content-main .cxl__heading {
	width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.2;
    margin: 0;
    padding: 0;
    pointer-events: none;
    font-size: 16vw;
    font-family: essonnes-display, serif;
    mix-blend-mode: soft-light;
    font-weight: normal;
    text-align: center;
    color: #c2ba8b;
    background: linear-gradient(to right,#033a80 10%,#49fcd4de 40%,#187bd0 60%,#2a8831 100%);
    /* background-size: 200% auto; */
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: shine 4s linear infinite;
}

/*--main block--*/

.slider-main {
    margin: 0 auto;
    z-index: 5;
    pointer-events: auto;
}
.slider-main.bl-click-right, 
.slider-main.bl-click-left {
	margin-top: 4em;
}
#block-ec section.xt-about, #block-port section.xt-about {
    margin-top: 7em;
}
#block-ec section.xt-services, #block-port section.xt-services {
    margin-top: 6em;
}
#block-ec section.xt-clients {
    margin-top: 7em;
}
.bl-click-contact, .bl-click-right, .bl-click-left {
	position: relative;
	width: 75%;
}

.schemes-group, .block-ec, .block-port {
	position: relative;
}
.ball {
    position: absolute;
    border-radius: 100%;
    opacity: 0.7;
}
.cls-1 {
    fill: none;
    stroke: #fff;
    stroke-width: 8px;
    fill-rule: evenodd;
            }
#blmain-canvas-block {
	background-image: url(../images/main-bg/cms-bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left center;
}
.nav-block .xt-logo img {
	min-width: 200px;
}

#block-ec, #block-it, #block-contact, #block-port {
	visibility:hidden;
    height:0px;
    overflow:hidden;
    transition:0.5s;
    -webkit-transition:0.5s;
    color: #fff;
}
#block-ec.visible, #block-it.visible, #block-contact.visible, #block-port.visible  {
	visibility:visible;
    height:100%;
}
#block-ec .-xt-opacity-bright, 
#block-it .-xt-opacity-bright, 
#block-contact .-xt-opacity-bright, 
#block-port .-xt-opacity-bright{
	opacity: 1;
}
#block-ec .xt-title-stroke::before, 
#block-ec .xt-title-stroke::after, 
#block-port .xt-title-stroke::before, 
#block-port .xt-title-stroke::after,
#block-ec .xt-skills__item::before, 
#block-ec .xt-skills__item::after,
#block-port .xt-skills__item::before, 
#block-port .xt-skills__item::after,
#block-ec .xt-clients__item::before,
#block-ec .xt-clients__item::after,
#block-ec .xt-clients__list::after,
#block-it .xt-title-stroke::before, 
#block-it .xt-title-stroke::after {
	background: #fff;
}
#block-ec svg, #block-it svg, #block-contact svg, #block-port svg {
	fill: #fff;
}
#block-ec section, #block-it section, #block-port section {
	display: block;
}

#block-ec-sub .xt-services .service-heading h3 div,
#block-port-sub .xt-services .service-heading h3 div {
 	position:relative;
 	display:inline-block;
 }

#block-ec h3.service-title, #block-ec h3.client-title,
#block-port h3.service-title, #block-contact h3.client-title  {
    font-weight: 200;
    text-transform: uppercase;
    font-size: 38px;
    padding: 0;
    line-height: 1.4;
}

.service-heading, .clients-heading {
    margin: 0 0 0;
}
/*--------- animate ----------*/
:root {
	--animate-duration: 2s;
	--animate-delay: 2s;
	--animate-repeat: 1
}

.-xt-animate {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-duration: var(--animate-duration);
	animation-duration: var(--animate-duration);
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.-xt-animate.animate__infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}

.-xt-animate.animate__repeat-1 {
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
	-webkit-animation-iteration-count: var(--animate-repeat);
	animation-iteration-count: var(--animate-repeat)
}

.-xt-animate.animate__repeat-2 {
	-webkit-animation-iteration-count: 2;
	animation-iteration-count: 2;
	-webkit-animation-iteration-count: calc(var(--animate-repeat)*2);
	animation-iteration-count: calc(var(--animate-repeat)*2)
}

.-xt-animate.animate__repeat-3 {
	-webkit-animation-iteration-count: 3;
	animation-iteration-count: 3;
	-webkit-animation-iteration-count: calc(var(--animate-repeat)*3);
	animation-iteration-count: calc(var(--animate-repeat)*3)
}

.-xt-animate.animate__delay-1s {
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
	-webkit-animation-delay: var(--animate-delay);
	animation-delay: var(--animate-delay)
}

.-xt-animate.animate__delay-2s {
	-webkit-animation-delay: 2s;
	animation-delay: 2s;
	-webkit-animation-delay: calc(var(--animate-delay)*2);
	animation-delay: calc(var(--animate-delay)*2)
}

.-xt-animate.animate__delay-3s {
	-webkit-animation-delay: 3s;
	animation-delay: 3s;
	-webkit-animation-delay: calc(var(--animate-delay)*3);
	animation-delay: calc(var(--animate-delay)*3)
}

.-xt-animate.animate__delay-4s {
	-webkit-animation-delay: 4s;
	animation-delay: 4s;
	-webkit-animation-delay: calc(var(--animate-delay)*4);
	animation-delay: calc(var(--animate-delay)*4)
}

.-xt-animate.animate__delay-5s {
	-webkit-animation-delay: 5s;
	animation-delay: 5s;
	-webkit-animation-delay: calc(var(--animate-delay)*5);
	animation-delay: calc(var(--animate-delay)*5)
}

.-xt-animate.animate__faster {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-duration: calc(var(--animate-duration)/2);
	animation-duration: calc(var(--animate-duration)/2)
}

.-xt-animate.animate__fast {
	-webkit-animation-duration: .8s;
	animation-duration: .8s;
	-webkit-animation-duration: calc(var(--animate-duration)*0.8);
	animation-duration: calc(var(--animate-duration)*0.8)
}

.-xt-animate.animate__slow {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-duration: calc(var(--animate-duration)*2);
	animation-duration: calc(var(--animate-duration)*2)
}

.-xt-animate.animate__slower {
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
	-webkit-animation-duration: calc(var(--animate-duration)*3);
	animation-duration: calc(var(--animate-duration)*3)
}

@media (prefers-reduced-motion:reduce),
print {
	.-xt-animate {
		-webkit-animation-duration: 1ms!important;
		animation-duration: 1ms!important;
		-webkit-transition-duration: 1ms!important;
		transition-duration: 1ms!important;
		-webkit-animation-iteration-count: 1!important;
		animation-iteration-count: 1!important
	}
	.-xt-animate[class*=Out] {
		opacity: 0
	}
}

@-webkit-keyframes backInDown {
	0% {
		-webkit-transform: translateY(-1200px) scale(.7);
		transform: translateY(-1200px) scale(.7);
		opacity: .7
	}
	80% {
		-webkit-transform: translateY(0) scale(.7);
		transform: translateY(0) scale(.7);
		opacity: .7
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

@keyframes backInDown {
	0% {
		-webkit-transform: translateY(-1200px) scale(.7);
		transform: translateY(-1200px) scale(.7);
		opacity: .7
	}
	80% {
		-webkit-transform: translateY(0) scale(.7);
		transform: translateY(0) scale(.7);
		opacity: .7
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1
	}
}

.-xt-animate-backInDown {
	-webkit-animation-name: backInDown;
	animation-name: backInDown
}

@-webkit-keyframes fadeInBottomLeft {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 100%, 0);
		transform: translate3d(-100%, 100%, 0)
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes fadeInBottomLeft {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(-100%, 100%, 0);
		transform: translate3d(-100%, 100%, 0)
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.-xt-animate-fadeInBottomLeft {
	-webkit-animation-name: fadeInBottomLeft;
	animation-name: fadeInBottomLeft
}


@-webkit-keyframes fadeInBottomRight {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(100%, 100%, 0);
		transform: translate3d(100%, 100%, 0)
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes fadeInBottomRight {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(100%, 100%, 0);
		transform: translate3d(100%, 100%, 0)
	}
	to {
		opacity: 1;
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

.-xt-animate-fadeInBottomRight {
	-webkit-animation-name: fadeInBottomRight;
	animation-name: fadeInBottomRight
}


/*------ transform heading ec --------*/
/*about heading*/
article.xt-about__text {
  opacity: 0;
  transition: opacity .5s .25s ease-out;
}

article.xt-about__text.is-visible {
  opacity: 1;
}

.xt-about__heading {
  transform: translate(0%, calc(-50% + 1em));
}

.is-visible .xt-about__heading {
  transform: translate(0%, -50%);
}

.xt-about__heading {
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              filter 10s 2s ease-out;
  will-change: transform;
}
/*service & client heading*/
div.service-heading, div.clients-heading {
  opacity: 0;
  transition: opacity 2s .25s ease-in;
}

div.service-heading.is-visible, div.clients-heading.is-visible {
  opacity: 1;
}

h3.service-title, h3.client-title {
  transform: translate(-10%, calc(-50% + 5em));
}

.is-visible h3.service-title, .is-visible h3.client-title {
  transform: translate(0%, -50%);
}

h3.service-title, h3.client-title {
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              filter 10s 2s ease-out;
  will-change: transform;
}

/*block-it*/

div#block-it section h1 {
	font-weight: normal;
    text-transform: capitalize;
    letter-spacing: 7px;
    font-size: 35px;
}
div#block-it section p {
	font-size: 18px;
    text-align: justify;
    font-weight: 300;
    letter-spacing: 1.5px;
    line-height: 1.5;
}
#block-it section.xt-web {
    margin-top: 6em;
}
#block-it section.xt-app {
    margin-top: 6em;
}
#block-it section.xt-software {
    margin-top: 6em;
}
/*block-contact*/
div#block-contact section {
    margin: 5em 0 5em 0 !important;
    padding: 0;
    display: block;
}
div#block-contact section header h2 {
	font-size: 38px;
    font-weight: normal;
    text-transform: capitalize;
}
div#block-contact section header h2 {
    margin: 0 0 5rem 0;
}
div#block-contact section header {
    /*padding: 0 10rem 0 5rem;
    max-width: 54rem;
    width: 100rem;*/
        padding: 0;
    width: 100%;
    text-align: right;
}
div#block-contact form.fcf-form-class {
    margin-top: 4em;
}
div#block-contact section .content p {
	color: #fff;
    font-size: 16px;
    text-decoration: none;
    border: none;
	font-weight: 300;
    letter-spacing: 6px;
    line-height: 2;
}
div#block-contact section .content .sales label, 
div#block-contact section .content .support label {
    padding: 0 0 0 2.5rem;
}
div#block-contact section .content label {
	color: #f5f5f5d4;
    font-size: 100%;
    font: inherit;
    text-decoration: none;
    border: none;
    letter-spacing: 6px;
    line-height: 2;
    text-transform: capitalize;
    padding: 0;
}
div#block-contact section .content .field.field-enq {
    margin-bottom: 3.5em;
}
div#block-contact section .content label.label-enq {
    position: relative;
    top: -80px;
}
div#block-contact section .content .field input.input-enq,
div#block-contact section .content .field textarea.input-enq {
	padding: 0 0 2px;
    max-width: 482px;
    width: 100%;
}
div#block-contact section .content .field textarea.input-enq {
	margin-bottom: 22px;
}
div#block-contact section .content input[type=text]:focus + label,
div#block-contact section .content input[type=email]:focus + label,
div#block-contact section .content input[type=tel]:focus + label,
div#block-contact section .content textarea:focus + label {
	opacity: 0;
}


input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: none;
  -webkit-text-fill-color: #f5f5f5d4 !important;
  transition: background-color 5000s ease-in-out 0s;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #f5f5f5d4 !important;
}

div#block-contact section .content .field input,
div#block-contact section .content .field textarea {
	/*color: #f5f5f569;*/
	font-size: 18px;
	letter-spacing: 4px;
	background-color: transparent;
	padding: 0px;
	padding: 0;
	border-style: solid;
    border-width: 0 0 1px 0;
    border-image: linear-gradient(to right, #f5f5f5d4, rgba(0, 0, 0, 0)) 1 25%;
}
div#block-contact section .content .field input {
	margin-bottom: 20px;
	    position: relative;
}
div#block-contact section .content .field textarea {
	height: 150px;
}
div#block-contact section .content .field .enq {
	width: 150px;
	padding-top: 0.3em;
	float: left;
	font-weight: 300;
}
.contact-enabled .slider-main.bl-click-contact {
    margin-top: 4em;
}
div#block-contact section .content .field .sales,
div#block-contact section .content .field .support {
	width: 130px;
    float: left;
}
div#block-contact section .content textarea + label.label-enq {
    top: -10em;
}
div#block-contact section .content .field, 
div#block-contact section .content .fcf-status, 
div#block-contact section .content .field .sales > input[type="radio"] + label,
div#block-contact section .content .field .support > input[type="radio"] + label {
    color: #f5f5f5d4;
    font-size: 16px;
    letter-spacing: 4px;
    height: 100%;
    max-height: 50px;
    margin-bottom: 1em;
}
div#block-contact section .content .field.field-textarea {
    max-height: 150px;
    margin-bottom: 3em;
    padding-top: 20px;
}
div#block-contact section .content .field#field-status strong {
	display: none;
}
div#block-contact section .content .field img {
	margin-bottom: 2em;
}
div#block-contact section .content .field svg {
	margin-left: 10px;
    margin-top: -30px;
}
div#block-contact section form button.button {
    color: #fff !important;
    font: inherit;
    border: solid .5px #f5f5f5d4;
    text-align: center;
    width: 200px;
    height: 40px;
}
div#block-contact section form button.button:hover {
    box-shadow: none;
}
div#block-contact section #fcf-thank-you p {
	color: #4ef2fd;
    font-size: 17px;
}
div#block-contact section .content .field svg .refresh_cls-1 {
	fill: #fff;
	stroke: transparent;
	stroke-width: 1px;
	fill-rule: evenodd;
}
div#block-contact section .content input[type="submit"] {
	height: 50px;
    font-size: 15px;
    text-transform: capitalize;
    letter-spacing: 3.5px;
    border: solid .5px #f5f5f5d4;
    background-color: transparent !important;
    box-shadow: none;
    color: #fff !important;
}
.js-validate-error-label {
    margin-top: -3em;
    font-size: 14px;
    font-weight: 300;
}
div#block-contact section footer ul li, div#block-contact section footer ul li a {
    color: #fff;
    font-size: 16px;
    text-decoration: none;
    border: none;
    letter-spacing: 6px;
    line-height: 2;
    margin-bottom: 3em;
    font-weight: 300;
}
div#block-contact .copyright {
    color: #f5f5f57d;
    font-size: 1.5rem;
    position: relative;
    width: 100%;
    text-align: center;
    margin-bottom: 2em;
}
div#block-contact section .o-half {
	padding: 0;
}
div#block-contact section div#field-status {
    margin-bottom: 3em;
}
div#block-contact #block-contact-sub .container {
    width: 100%;
}
/* Social contact*/
.cxl-social-contact {
    position: absolute;
    left: 45px;
    bottom: 3em;
    z-index: 1000;
    padding: 100px 0 0 0;
}
.cxl-social-contact:before {
    content: "";
    display: table;
}
.cxl-social-contact li a.qlwapp-toggle {
    display: inline-block;
    width: 32px;
    height: 32px;
    text-align: center;
    padding: 5px 0 0;
}
#cxl-social-contactPort li a.qlwapp-toggle {
    display: inline-block;
    width: 100%;
    height: auto;
    padding: 0;
}
.cxl-social-contact::after {
    position: absolute;
    left: 50%;
    top: 25px;
    height: 60px;
    width: 1px;
    display: block;
    background: #fff;
    opacity: 0.75;
    content: "";
    clear: both;
}
.cxl-social-contact:hover:after {
    opacity: 1;
}
#cxl-social-contactPort:hover:after {
	opacity: 0 !important;
}
#cxl-social-contactPort:hover li a.qlwapp-toggle svg.whatsapp_cls {
    width: 28px !important;
    height: 28px !important;
}
#cxl-social-contactPort svg.whatsapp_cls {
	margin-top: 8px !important;
    margin-left: 0px !important;
}
#cxl-social-contactPort::after {
	opacity: 0 !important;
}
#cxl-social-contactPort {
    bottom: 5em !important;
}

/* social contact svg*/
svg.whatsapp_cls {
    margin-top: -1em;
    margin-left: -2px;
}
.whatsapp_cls-1 {
	fill: #fff;
	stroke: transparent;
	stroke-width: 0;
	fill-rule: evenodd;
}
#wrapper section.footer-it, #wrapper section.footer-ec {
	display: none;
}
body.ec-enabled #wrapper section.footer-ec, body.it-enabled #wrapper section.footer-it {
	display: block;
	z-index: 999;
}

body.it-enabled .cxl-social-contact {
    right: 48px !important;
    left: auto !important;
}
#block-it section.xt-about {
    margin-top: 7em;
}
.xt-services em {
    font-style: normal;
    font-weight: 400;
}
#block-it .xt-web .o-section__bg, #block-it .xt-app .o-section__bg, #block-it .xt-software .o-section__bg {
    opacity: 0.8;
}
.contact-enabled .nav-block .cxl-mirror-slideshow__ui.is-visible {
    z-index: 0;
}

.contact-enabled #block-contact .container, 
.ec-enabled #block-ec .container,
.port-enabled #block-port .container,
.it-enabled #block-it .container {
	width: 100%;
}
#block-ec .xt-skills__item h3 {
    margin-left: -14px;
}
#block-port .xt-skills__item h3 {
	margin-left: 0px !important;
}
.port-enabled #block-port .xt-services p {
    letter-spacing: .2px !important;
}
.port-enabled #block-port .xt-services p {
    text-align: justify;
}
#block-port .xt-skills__item img {
    position: absolute;
    width: 100%;
    height: 100%;
}
#block-port .xt-skills__item {
    min-height: 250px;
    max-height: 300px;
    height: 300px;
    padding: 0;
}
#block-port .xt-skills__item.xt-skills__itemContent {
    padding: 25px 30px !important;
}
#block-ec .xt-skills__item ul,
#block-port .xt-skills__item ul {
	padding-left: 0.1rem;
}
#block-ec .xt-skills__item ul li,
#block-port .xt-skills__item ul li {
    padding-left: 0;
    padding-bottom: 5px;
    font-size: 14px;
    font-weight: 300;
}

#block-it ul {
	padding-left: 0.1rem;
	margin-left: 18px;
}
#block-it ul li {
    padding-left: 0;
    padding-bottom: 5px;
    font-size: 18px;
    font-weight: 300;
}
#block-port .xt-skills__listMob {display: none;}
#block-port section.xt-services .xt-skills {
    margin-bottom: 35px;
}
@media (max-width: 999px) {
	#block-port .xt-skills__listDesk {display: none;}
	#block-port .xt-skills__listMob {display: block;}
}
/* ---------- custom code -----------*/
/* ---------- social item hint code -----------*/

.sct-item-hints {
    height: 50px;
    width: 50px;
    margin: 0px auto;
}
.sct-item-hints .sct-hint {
  width: 50px;
  height: 50px;
  margin: 0px auto;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sct-item-hints .sct-hint::before {
  /* //rotated squre */
  background-color: transparent;
  width: 8px;
  height: 8px;
  z-index: 2;
  -webkit-clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.sct-item-hints .sct-hint::after {
  /* //green glow */
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  width: 2px;
  height: 2px;
  z-index: 1;
  -webkit-box-shadow: 0 0 50px 30px rgba(72, 170, 72, 0.3);
  box-shadow: 0 0 50px 30px rgba(72, 170, 72, 0.3);
  -webkit-animation: home_hero_item_hints_glow 2s
    cubic-bezier(0.25, 0.1, 0.2, 1) infinite;
  animation: home_hero_item_hints_glow 2s cubic-bezier(0.25, 0.1, 0.2, 1)
    infinite;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}
@-webkit-keyframes home_hero_item_hints_glow {
  0% {
    -webkit-box-shadow: 0 0 30px 5px #48aa48;
    box-shadow: 0 0 30px 5px #48aa48;
  }
  70% {
    -webkit-box-shadow: 0 0 70px 50px rgba(72, 170, 72, 0);
    box-shadow: 0 0 70px 50px rgba(72, 170, 72, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 50px rgba(72, 170, 72, 0);
    box-shadow: 0 0 0 50px rgba(72, 170, 72, 0);
  }
}
@keyframes home_hero_item_hints_glow {
  0% {
    -webkit-box-shadow: 0 0 30px 5px #48aa48;
    box-shadow: 0 0 30px 5px #48aa48;
  }
  70% {
    -webkit-box-shadow: 0 0 70px 50px rgba(72, 170, 72, 0);
    box-shadow: 0 0 70px 50px rgba(72, 170, 72, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 50px rgba(72, 170, 72, 0);
    box-shadow: 0 0 0 50px rgba(72, 170, 72, 0);
  }
}
.sct-item-hints .sct-hint-dot {
  z-index: 3;
  border: 1px solid #fff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: block;
  -webkit-transform: translate(-0%, -0%) scale(0.95);
  transform: translate(-0%, -0%) scale(0.95);
  -webkit-animation: home_hero_item_hints_border 2s linear infinite;
  animation: home_hero_item_hints_border 2s linear infinite;
  margin: auto;
}
@-webkit-keyframes home_hero_item_hints_border {
  0%,
  100% {
    border-color: rgba(255, 255, 255, 0.6);
    -webkit-transform: translate(-50%, -50%) scale(0.95);
    transform: translate(-0%, -0%) scale(0.95);
  }
  50% {
    border-color: rgba(255, 255, 255, 0.3);
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-0%, -0%) scale(1);
  }
}
@keyframes home_hero_item_hints_border {
  0%,
  100% {
    border-color: rgba(255, 255, 255, 0.6);
    -webkit-transform: translate(-50%, -50%) scale(0.95);
    transform: translate(-0%, -0%) scale(0.95);
  }
  50% {
    border-color: rgba(255, 255, 255, 0.3);
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-0%, -0%) scale(1);
  }
}
.sct-item-hints .sct-hint-radius {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  width: 100px;
  height: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -50px 0 0 -50px;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition-property: background-color, opacity, visibility,
    -webkit-transform;
  transition-property: background-color, opacity, visibility, -webkit-transform;
  transition-property: background-color, opacity, visibility, transform;
  transition-property: background-color, opacity, visibility, transform,
    -webkit-transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease, ease, ease,
    cubic-bezier(0.5, 0, 0, 1);
  transition-timing-function: ease, ease, ease, cubic-bezier(0.5, 0, 0, 1);
}
.sct-item-hints .sct-hint:hover .sct-hint-radius,
.sct-item-hints .sct-hint:focus .sct-hint-radius,
.sct-item-hints .sct-hint:active .sct-hint-radius {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.sct-item-hints .sct-hint[data-position="1"] .sct-hint-content {
  top: 85px;
  left: 50%;
  margin-left: 56px;
}
.sct-item-hints .sct-hint-content {
  color: #fff;
  width: 300px;
  position: absolute;
  z-index: 5;
  padding: 12px 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.7s ease, visibility 0.7s ease;
  transition: opacity 0.7s ease, visibility 0.7s ease;
  pointer-events: none;
  color: #fff;
  visibility: hidden;
  pointer-events: none;
  font-family: monospace;
  text-align: center;
}
.sct-item-hints .sct-hint:hover .sct-hint-content {
  color: #fff;
  width: 300px;
  position: absolute;
  z-index: 5;
  padding: 12px 0;
  opacity: 1;
  visibility: visible !important;
  -webkit-transition: opacity 0.7s ease, visibility 0.7s ease;
  transition: opacity 0.7s ease, visibility 0.7s ease;
  pointer-events: none;
  color: #fff;
  visibility: hidden;
  pointer-events: none;
  font-family: monospace;
  text-align: center;
}
.sct-item-hints .sct-hint:focus .sct-hint-content,
.sct-item-hints .sct-hint:active .sct-hint-content {
	opacity: 0;
}

.sct-item-hints .sct-hint-content::before {
  width: 0px;
  bottom: 0;
  left: 0;
  content: "";
  background-color: #fff;
  height: 1px;
  position: absolute;
  transition: width 0.4s;
}
.sct-item-hints .sct-hint:hover .sct-hint-content::before,
.sct-item-hints .sct-hint:focus .sct-hint-content::before,
.sct-item-hints .sct-hint:active .sct-hint-content::before {
  width: 180px;
  transition: width 0.4s;
}
.sct-item-hints .sct-hint-content::after {
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transform: rotate(-225deg);
  transform: rotate(-225deg);
  bottom: 0;
  left: 0;
  width: 80px;
  content: "";
  background-color: #fff;
  height: 1px;
  position: absolute;
  opacity: 1;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
  transition-delay: 0s;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.sct-item-hints .sct-hint-content span {
	font-weight: bold;
}
.sct-item-hints .sct-hint:hover .sct-hint-content::after,
.sct-item-hints .sct-hint:focus .sct-hint-content::after,
.sct-item-hints .sct-hint:active .sct-hint-content::after {
  opacity: 1;
  visibility: visible;
}
.sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
  bottom: 85px;
  left: 50%;
  margin-left: 60px;
}
.cxl-social-contact li a.mail-content {
    color: #fff;
}
.cxl-social-contact.mobile#cxl-social-contactPort {
	display: none;
}
.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
    background-color: transparent;
    padding: 5px;
}
.cxl-social-contact.mobile#cxl-social-contactPort li a img{
	animation: wiggle 2s linear infinite;
}

/* Keyframes */
@keyframes wiggle {
  0%, 7% {
    transform: rotateZ(0);
  }
  15% {
    transform: rotateZ(-15deg);
  }
  20% {
    transform: rotateZ(10deg);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  30% {
    transform: rotateZ(6deg);
  }
  35% {
    transform: rotateZ(-4deg);
  }
  40%, 100% {
    transform: rotateZ(0);
  }
}
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {
	.cxl-social-contact.mobile#cxl-social-contactPort {
		display: block;
	}
	.cxl-social-contact#cxl-social-contactPort {
		display: none;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort svg.whatsapp_cls {
	    margin-top: 8px !important;
	    margin-left: 8px !important;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle {
	    display: inline-block;
	    float: left;
	    width: 40px;
	    height: auto;
	    padding: 20px 0 0 0;
        pointer-events: visible;
	}	
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle::after {
	    position: absolute;
	    left: 15%;
	    top: 10px;
	    height: 60px;
	    width: 1px;
	    display: block;
	    background: linear-gradient(#f3f3f329, #fff, #f3f3f329);
	    opacity: 0.75;
	    content: "";
	    clear: both;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li img{
/*		filter: invert(1);	   */
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p{
		float: right;
	    width: 250px;
	    padding-left: 5px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {

  	.cxl-social-contact.mobile#cxl-social-contactPort {
		display: block;
	}
	.cxl-social-contact#cxl-social-contactPort {
		display: none;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort svg.whatsapp_cls {
	    margin-top: 8px !important;
	    margin-left: 8px !important;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle {
	    display: inline-block;
	    float: left;
	    width: 40px;
	    height: auto;
	    padding: 20px 0 0 0;
        pointer-events: visible;
	}	
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle::after {
	    position: absolute;
	    left: 15%;
	    top: 10px;
	    height: 60px;
	    width: 1px;
	    display: block;
	    background: linear-gradient(#f3f3f329, #fff, #f3f3f329);
	    opacity: 0.75;
	    content: "";
	    clear: both;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li img{
/*		filter: invert(1);	   */
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p{
		float: right;
	    width: 250px;
	    padding-left: 5px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}
/* Landscape */
@media only screen 
  and (min-device-width: 600px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
  	.cxl-social-contact.mobile#cxl-social-contactPort {
		display: block;
	}
	.cxl-social-contact#cxl-social-contactPort {
		display: none;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort svg.whatsapp_cls {
	    margin-top: 8px !important;
	    margin-left: 8px !important;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle {
	    display: inline-block;
	    float: left;
	    width: 40px;
	    height: auto;
	    padding: 20px 0 0 0;
        pointer-events: visible;
	}	
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle::after {
	    position: absolute;
	    left: 15%;
	    top: 10px;
	    height: 60px;
	    width: 1px;
	    display: block;
	    background: linear-gradient(#f3f3f329, #fff, #f3f3f329);
	    opacity: 0.75;
	    content: "";
	    clear: both;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li img{
/*		filter: invert(1);	   */
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p{
		float: right;
	    width: 250px;
	    padding-left: 5px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
  	.cxl-social-contact.mobile#cxl-social-contactPort {
		display: block;
	}
	.cxl-social-contact#cxl-social-contactPort {
		display: none;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort svg.whatsapp_cls {
	    margin-top: 8px !important;
	    margin-left: 8px !important;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle {
	    display: inline-block;
	    float: left;
	    width: 40px;
	    height: auto;
	    padding: 20px 0 0 0;
        pointer-events: visible;
	}	
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle::after {
	    position: absolute;
	    left: 15%;
	    top: 10px;
	    height: 60px;
	    width: 1px;
	    display: block;
	    background: linear-gradient(#f3f3f329, #fff, #f3f3f329);
	    opacity: 0.75;
	    content: "";
	    clear: both;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li img{
/*		filter: invert(1);	   */
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p{
		float: right;
	    width: 250px;
	    padding-left: 5px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
		margin-left: 25px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-content::before {
		left: 35px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-content::after {
		left: 35px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-radius {
	    width: 75px;
	    height: 75px;
	    top: 75%;
	    left: 75%;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p {
		font-size: 13px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}
@media (max-width: 999px) {
	.cxl-social-contact.mobile#cxl-social-contactPort {
		display: block;
	}
	.cxl-social-contact#cxl-social-contactPort {
		display: none;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort svg.whatsapp_cls {
	    margin-top: 8px !important;
	    margin-left: 8px !important;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle {
	    display: inline-block;
	    float: left;
	    width: 40px;
	    height: auto;
	    padding: 20px 0 0 0;
        pointer-events: visible;
	}	
	.cxl-social-contact.mobile#cxl-social-contactPort li a.qlwapp-toggle::after {
	    position: absolute;
	    left: 15%;
	    top: 10px;
	    height: 60px;
	    width: 1px;
	    display: block;
	    background: linear-gradient(#f3f3f329, #fff, #f3f3f329);
	    opacity: 0.75;
	    content: "";
	    clear: both;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li img{
/*		filter: invert(1);	   */
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p{
		float: right;
	    width: 250px;
	    padding-left: 5px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
		margin-left: 25px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-content::before {
		left: 35px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-content::after {
		left: 35px;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort .sct-item-hints .sct-hint-radius {
	    width: 75px;
	    height: 75px;
	    top: 75%;
	    left: 75%;
	}
	.cxl-social-contact.mobile#cxl-social-contactPort li p {
		font-size: 13px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
  	.cxl-social-contact.mobile#cxl-social-contactPort li p {
	    font-size: 10px;
	    text-align: justify;
	    padding-left: 12px;
	}
	.cxl-social-contact#cxl-social-contactPort .sct-item-hints .sct-hint[data-position="4"] .sct-hint-content {
	    background-color: #031e29de;
	}
}