/*START PRELOADER STYLES*/
	.preloader-container {
		position: fixed;
		width: 100vw;
		height: 100vh;
		top: 0;
		left: 0;
		overflow: hidden;
		background: #333;
		z-index: 50000;
		overflow: hidden !important;
	}

	.preloader-wrapper {
		position: relative;
		width: 200px;
		height: 300px;
		margin: 0 auto;
		margin-top: calc(50vh - 100px);
		z-index: 600000;
	}

	.dm-preloader {
		position: absolute;
		width: 200px;   
		height: auto; 
	}


	.vertical-line-container {  
		width: 200px;
		height: 202px;
		transform: scaleY(-1);
	}

	.vertical-line {
		stroke-dasharray: 200;
	  stroke-dashoffset: 200; 
	  animation: vertical-dash 3s linear infinite;
	}


	.arrow-01-container {
		width: 200px;
		height: 0;
		overflow: hidden;
		animation: arrow-01-container 3s linear infinite;
		animation-delay: 0.4s;
	}

	.arrow-02-container {
		width: 200px;
		height: 0; 
		overflow: hidden;
		animation: arrow-02-container 3s linear infinite;
		animation-delay: 0.7s;
	}

	.arrow-03-container {
		width: 200px;
		height: 0; 
		overflow: hidden;
		animation: arrow-03-container 3s linear infinite;
		animation-delay: 1s;
	}


	.circle-container-left {
		width: 100px;
		height: 100px;
		overflow: hidden;
	}

	.circle-container-right {
		margin-left: 100px;
		width: 100px;
		height: 100px;
		overflow: hidden;
		transform: scaleX(-1);
	}

	.circle { 
	  stroke-dasharray: 650;
		stroke-dashoffset: 650;
		transform: scale(1);
	  animation: circle-dash 3s linear infinite;
		animation-delay: 1.1s;
	}


	.horizontal-line-container-left {
		margin-left: 100px;
		width: 100px;
		height: 100px;
		overflow: hidden !important; 
	}

	.horizontal-line-container-right {
		width: 100px;
		height: 100px;
		overflow: hidden !important;
		transform: scaleX(-1);
	}

	.horizontal-line {
	  stroke-dasharray: 650;
	  stroke-dashoffset: 650;
		opacity: 0;
	  animation: horizontal-dash 3s linear infinite;
		animation-delay: 0.8s;
	}


	@keyframes vertical-dash {
		0% {
			opacity: 0;
			transform: translateY(0);
	    stroke-dashoffset: 200;
	  }
		20% {
			opacity: 0;
			transform: translateY(0);
			stroke-dashoffset: 200;
		}
		40% {
			opacity: 1;
			transform: translateY(2.5px);
			stroke-dashoffset: 0;
		}
		60% {
			opacity: 1;
			transform: translateY(5px);
			stroke-dashoffset: 0;
		}
		80% {
			opacity: 1;
			transform: translateY(7.5px);
			stroke-dashoffset: 0;
		}
		100% {
			opacity: 0;
			transform: translateY(10px);
			stroke-dashoffset: 0;
		}
	}

	@keyframes arrow-01-container {
		0% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		20% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		40% {
			opacity: 1;
			transform: translateY(-2.5px);
			height: 125px;
		}
		80% {
			opacity: 1;
			transform: translateY(-7.5px);
			height: 125px; 
		}
		100% {
			opacity: 0;
			transform: translateY(-10px);
			height: 125px;
		}
	}

	@keyframes arrow-02-container {
		0% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		20% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		40% {
			opacity: 1;
			transform: translateY(-2.5px);
			height: 100px;
		}
		80% {
			opacity: 1;
			transform: translateY(-7.5px);
			height: 100px; 
		}
		100% {
			opacity: 0;
			transform: translateY(-10px);
			height: 100px;
		}
	}

	@keyframes arrow-03-container {
		0% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		20% {
			opacity: 0;
			transform: translateY(0);
			height: 0;
		}
		40% {
			opacity: 1;
			transform: translateY(-2.5px);
			height: 75px;
		}
		80% {
			opacity: 1;
			transform: translateY(-7.5px);
			height: 75px; 
		}
		100% {
			opacity: 0;
			transform: translateY(-10px);
			height: 75px;
		}
	}

	@keyframes circle-dash {
		0% {
			transform: scale(1);
			opacity: 0;
	    stroke-dashoffset: 650;
	  }
		20% {
			transform: scale(1);
			opacity: 0;
	    stroke-dashoffset: 650;
	  }
		40% {
			transform: scale(1);
			opacity: 1;
	    stroke-dashoffset: 0;
	  }
		60% {
			transform: scale(1);
			opacity: 1;
	    stroke-dashoffset: 0;
	  }
		90% {
			transform: scale(0.95);
			opacity: 0;
	    stroke-dashoffset: 0;
	  }
		100% {
			transform: scale(0.95);
			opacity: 0;
			stroke-dashoffset: 0;
		}
	}

	@keyframes horizontal-dash {
		0% {
			opacity: 0;
	    stroke-dashoffset: 650;
	  }
		20% {
			opacity: 1;
	    stroke-dashoffset: 0;
	  }
		60% {
			opacity: 1;
	    stroke-dashoffset: 0;
	  }
		80% {
			opacity: 0;
	    stroke-dashoffset: 0;
	  }
		100% {
			opacity: 0;
			stroke-dashoffset: 0;
		}
	}
/*END PRELOADER STYLES*/

/*START @FONT-FACE RULES*/

	@font-face {
		font-family: 'proxima-nova-italic';
		src: url('../fonts/pn-200-italic.woff2') format('woff2'),
			 url('../fonts/pn-200-italic.woff') format('woff');
		font-weight: 200;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova-italic';
		src: url('../fonts/pn-300-italic.woff2') format('woff2'),
			 url('../fonts/pn-300-italic.woff') format('woff');
		font-weight: 300;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova';
		src: url('../fonts/pn-300.woff2') format('woff2'),
			 url('../fonts/pn-300.woff') format('woff');
		font-weight: 300;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova';
		src: url('../fonts/pn-400.woff2') format('woff2'),
			 url('../fonts/pn-400.woff') format('woff');
		font-weight: 400;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova';
		src: url('../fonts/pn-500.woff2') format('woff2'),
			 url('../fonts/pn-500.woff') format('woff');
		font-weight: 500;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova';
		src: url('../fonts/pn-700.woff2') format('woff2'),
			 url('../fonts/pn-700.woff') format('woff');
		font-weight: 700;
		font-style: normal;
	}

	@font-face {
		font-family: 'proxima-nova';
		src: url('../fonts/pn-900.woff2') format('woff2'),
			 url('../fonts/pn-900.woff') format('woff');
		font-weight: 900;
		font-style: normal;
	}


	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Black.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Black.woff') format('woff');
		font-weight: 900;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Heavy.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Heavy.woff') format('woff');
		font-weight: 800;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Bold.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Bold.woff') format('woff');
		font-weight: 700;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-SemiBold.woff2') format('woff2'),
			 url('../fonts/agape/Agape-SemiBold.woff') format('woff');
		font-weight: 600;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Regular.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Regular.woff') format('woff');
		font-weight: 400;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Light.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Light.woff') format('woff');
		font-weight: 300;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-Thin.woff2') format('woff2'),
			 url('../fonts/agape/Agape-Thin.woff') format('woff');
		font-weight: 200;
		font-style: normal;
	}

	@font-face {
		font-family: 'agape';
		src: url('../fonts/agape/Agape-UltraLight.woff2') format('woff2'),
			 url('../fonts/agape/Agape-UltraLight.woff') format('woff');
		font-weight: 100;
		font-style: normal;
	}

	/*@font-face {
		font-family: 'helvetica';
		src: url('../fonts/helvetica/helvetica-bold.woff2') format('woff2'),
			 url('../fonts/helvetica/helvetica-bold.woff') format('woff');
		font-weight: 700;
		font-style: normal;
	}*/
/*END @FONT-FACE RULES*/

/*START GENERAL STYLES*/

	html,
	body {
		width: 100vw;
		overflow-x: hidden !important;
		font-family: 'proxima-nova', sans-serif;
		text-rendering: optimizeLegibility !important;
		-webkit-font-smoothing: antialiased !important;
		-moz-osx-font-smoothing: grayscale !important;
	}

	* {
	      -webkit-tap-highlight-color: rgba(0,0,0,0); /* Stops flash on tap iOS */
	      outline: none !important;
	      box-sizing: border-box;
	   }

	a {
		text-decoration: none !important;
	}

	.clear-fix {
		clear: both;
	}

	input {
		outline: none !important;
	}

	input::-webkit-inner-spin-button {
	  -webkit-appearance: none !important;
	}

	/*START RANGE INPUT STYLES*/

		input[type=range] {
			-webkit-appearance: none;
			appearance: none;
			width: 100%;
			height: 10px;
			cursor: pointer;
			outline: none;
		}

		input[type=range]::-webkit-slider-thumb {
			-webkit-appearance: none;
			appearance: none;
		}

		input[type=range]:focus {
			outline: none;
		}

		input[type=range] {
			-webkit-appearance: none;
			/* Hides the slider so that custom slider can be made */
			width: 100%;
			/* Specific width is required for Firefox. */
		}

		input[type=range]::-webkit-slider-thumb {
			-webkit-appearance: none;
		}

		input[type=range]:focus {
			outline: none;
			/* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
		}

		input[type=range]::-ms-track {
			width: 100%;
			cursor: pointer;
			background: transparent;
			/* Hides the slider so custom styles can be added */
			border-color: transparent;
			color: transparent;
		}

		input[type=range]::-webkit-slider-thumb {
			-webkit-appearance: none;
			appearance: none;
			border: none;
			height: 10px;
			width: 10px;
			background: transparent;
			margin-top: 0;
			box-shadow: none;
		}


		/* All the same stuff for Firefox */

		input[type=range]::-moz-range-thumb {
			-moz-appearance: none;
			appearance: none;
			border: none;
			height: 10px;
			width: 10px;
			background: transparent;
			margin-top: 0;
			box-shadow: none;
		}

		input[type=number]::-moz-range-thumb {
			-moz-appearance: none;
			appearance: none;
			border: none;
			height: 10px;
			width: 10px;
			background: transparent;
			margin-top: 0;
			box-shadow: none;
		}


		/* All the same stuff for IE */

		input[type=range]::-ms-thumb {
			box-shadow: none;
			border: none;
			height: 10px;
			width: 10px;
			border-radius: 3px;
			background: transparent;
			cursor: pointer;
		}
	/*END RANGE INPUT STYLES*/
/*END GENERAL STYLES*/

/*START MAIN CONTENT BLUR STYLES*/
	.main-content {
		/*-webkit-filter: blur(0);*/
		transition: all 0.3s ease-out;
	}

	.main-content.blurred {
		/*-webkit-filter: blur(5px);*/
		transition: all 0.3s ease-out;
	}

	.header-bar {
		/*-webkit-filter: blur(0);*/
		transition: all 0.3s ease-out;
	}

	.header-bar.blurred {
		/*-webkit-filter: blur(5px);*/
		transition: all 0.3s ease-out;
	}

	#recaptcha {
	  position: absolute;
	  opacity: 0;
	  visibility: hidden;
	}
/*END MAIN CONTENT BLUR STYLES*/

/*START BG LAYER STYLES*/
	.bg-solid {
		position: fixed;
		width: 100vw;
		height: 100vh;
		overflow: hidden;
		z-index: -8;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: #f1f1f1;
	}
/*END BG LAYER STYLES*/

.ui-loader-textonly{display: none;}

.ui-loader-textonly .ui-icon-loading {
    display: none;
}

.ui-loader {
    display: none;
}