@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700); /* Open sans goes for anyting and everything around epage */

html { font-size: 10px; overflow-y: scroll; }

body {
	/*overflow: hidden;*/
	margin: 0;
	color: #5F5F5F;
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: normal; }

a { text-decoration: none; }
a img { border:none; }

.bold { font-weight: bold; }
.underline { text-decoration: underline; }
.hide_this { display: none; }
.hidden { display: none !important; }
.left { float: left; }
.right { float: right; }
.center { display: inline-block; margin:0 auto; }
.clear { clear: both; }
.pointer { cursor: pointer; }

/* Content loader */
.contentLoader {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: 0;
	width: 100%;
	height: 2px;
	overflow: hidden;
	background-color: #e9e9e9;
}
	.contentLoaderBar{
		position: absolute;
		width: 100%;
		height: 100%;
		left: -100%;
		background-color: #00abff;
	}
	.contentLoaderAnimation1 { animation: contentLoaderAnimation1 2s linear infinite; }
	.contentLoaderAnimation2 { animation: contentLoaderAnimation2 2s linear infinite; }
	.contentLoaderAnimation3 { animation: contentLoaderAnimation3 2s linear infinite; }
	@keyframes contentLoaderAnimation1 {
	    from 	{ left: -20%; width: 30%; }
	    50% 	{ width: 30%; }
	    70% 	{ width: 70%; }
	    80% 	{ left: 50%; }
	    95% 	{ left: 120%; }
	    to 		{ left: 100%; }
	}
	@keyframes contentLoaderAnimation2 {
	    from 	{ left: -100%; }
	    30% 	{ left: -70%; }
		60% 	{ left: -60%; }
	    70% 	{ left: 40%; }
	    85% 	{ left: 120%; }
	    to 		{ left: 100%; }
	}
	@keyframes contentLoaderAnimation3 {
	    from 	{ left: -100%; }
	    30% 	{ left: -20%; }
		60% 	{ left: -10%; }
	    70% 	{ left: 0%; }
	    85% 	{ left: 120%; }
	    to 		{ left: 100%; }
	}

.block_font_style { font-size: 16px; font-size: 1.6rem; color: #5F5F5F; word-wrap: break-word; }
.block_font_style h1 { font-size: 36px; font-size: 3.6rem; margin: 0; font-weight: normal; }
.block_font_style h2 { font-size: 24px; font-size: 2.4rem; margin: 0; font-weight: normal; }
.block_font_style h3 { font-size: 20px; font-size: 2.0rem; margin: 0; font-weight: normal; }

.block_font_style ul { list-style-type: disc; }
.block_font_style ol { list-style-type: decimal; }
.block_font_style ul,
.block_font_style ol {
	padding-left: 40px;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

/* Background cover ------------------------------------------------------ */
#BODY_BACKGROUND_COVER_CONTAINER { position: fixed; z-index: -9999; top: 0px; left: 0px; width: 100%; height: 101%; }
#BODY_BACKGROUND_COVER { width: 100%; height: 100%; }

#section_header_background, #section_content_background, #section_footer_background, .row_background, .row_freeblocks, .block_background { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }

/* Row */
.rowitem, .row_content { position: relative; }

/* Grid */
.column_item { float: left; }
.column_item .column_padding{ min-width: 1px; }
.column_empty_box { height: 50px; }

/* Block */
.blockitem {
	position: relative;
	margin-top: 3rem;
}
.block_body { position: relative; max-width: 100%; overflow: hidden; }
.block_border { position: relative; }
.block_padding { position: relative; border: 0 #000 solid; }
.block_content { position: relative; overflow: hidden; }

.block_text .block_content.block_radius,
.block_button .block_content.block_radius { border-radius: 0 !important; }

.freeblock_placeholder { position: absolute; width: 0; height: 0; }
.block_content .block_heightpercent_wrapper { position: relative; overflow: hidden; }
.block_content .block_heightpercent_content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.block_text { -webkit-text-size-adjust: 100%; }
.video_iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }
.block_picture .image_thumb { display: block; }
.block_picture .image_orginal { display: none; }
#NOROW_FREEBLOCKS { position: relative; margin:0px auto; }

/* Block margin top - The first block in a COLUMN */
.mobile_version_2 .column_item .blockitem:first-child,
.mobile_version_3 .column_item .blockitem:first-child { margin-top: 0; }
@media only screen and (min-width:769px){ .mobile_version_1 .column_item .blockitem:first-child { margin-top: 0; } } /* Only none-mobile view */

/* Block margin top - The first  block in a ROW */
@media only screen and (max-width:768px){ .mobile_version_1 .rowitem .column_item:first-child .blockitem:first-child { margin-top: 0; } } /* Only mobile view */


/* Block button */
.block_button { text-align: center; }
.block_button .block_body { display: inline-block; }
.block_button .block_padding { border: 1px #3a3a3a solid; padding-top: 1rem; padding-bottom: 1rem; padding-left: 2rem; padding-right: 2rem; }
.block_button .block_font_style { color: #3a3a3a; }

/* Pic slider */
div.bjqs-controls span{ background-image: url('picslider_arrows2.png'); }


/* Hiding mobile menu */
.CSS_TOP_NAV_MOBILE, .TOP_NAV_MOBILE_SPACE { display: none; }

/* VARIBLE FOR JS TO SNIFF SCREEN SNAPS */
#CONTENT_DEFAULT { max-height: 0; }

/* Mobile settings V1 & V2 */
@media only screen and (max-width:768px){

	#CONTENT_DEFAULT { max-height: 786px; } /* VARIBLE FOR JS TO SNIFF SCREEN SNAPS */

	.mobile_hidden { display: none; }

	/* Mobile settings V1 */
	.mobile_version_1 .ROW_HEADER_NAV, .mobile_version_2 .ROW_HEADER_NAV{ display: none; }
	.mobile_version_1 .CSS_TOP_NAV, .mobile_version_2 .CSS_TOP_NAV{ display: none; }
	.mobile_version_1 #NAVMENU_PLACEHOLDER_FIXED_SPACE, .mobile_version_2 #NAVMENU_PLACEHOLDER_FIXED_SPACE{ display: none; }
	.mobile_version_1 .CSS_TOP_NAV_MOBILE, .mobile_version_2 .CSS_TOP_NAV_MOBILE{ display: block; }
	.mobile_version_1 .TOP_NAV_MOBILE_SPACE, .mobile_version_2 .TOP_NAV_MOBILE_SPACE{ display: block; }

	/* Disable animations */
	.mobile_version_1 .ep-animate,
	.mobile_version_1 .ep-animate-hover {
		-o-transition-property: none; -moz-transition-property: none; -ms-transition-property: none; -webkit-transition-property: none; transition-property: none;
		-o-transform: none; -moz-transform: none; -ms-transform: none; -webkit-transform: none; transform: none;
		-webkit-animation: none; -moz-animation: none; -o-animation: none; -ms-animation: none; animation: none;
	}

	.mobile_version_1 .block_picture .image_orginal { display: block; }
	.mobile_version_1 .block_picture .image_thumb { display: none; }

	.mobile_version_1 .rowitem .row_content, .mobile_version_1 #CONTENT_DEFAULT { width: 100% !important; max-width: 100% !important; }

	.mobile_version_1 .column_item { width: 100% !important; }
	.mobile_version_1 .column_item .column_padding { padding-left: 2rem !important; padding-right: 2rem !important; }
	/*.mobile_version_1 .block_mobile_padding .block_content{ padding-left: 2% !important; padding-right: 2% !important; }*/

	.mobile_version_1 .column_empty_box { display: none; }


	/*
	Removes all bakground fixed for mobile.
	Fixed for Andriod: It dose nothing. It will behave as if it was set to: scroll'
	Fixed for Ipone: It will bugg, the background will act as if it was the entire body even it its only used on a row or section
	*/
	body, #section_header_background, #section_content_background, #section_footer_background, .row_background, .block_background { background-attachment: scroll !important; }
}


/* Responsive <html> font size (Viewport-width / 100) */
@media only screen and (max-width:320px) { html { font-size: 3.2px; } }
@media only screen and (min-width:321px) and (max-width:400px){ html { font-size: 4px; } }
@media only screen and (min-width:401px) and (max-width:500px){ html { font-size: 5px; } }
@media only screen and (min-width:501px) and (max-width:600px){ html { font-size: 6px; } }
@media only screen and (min-width:601px) and (max-width:700px){ html { font-size: 7px; } }
/*@media only screen and (min-width:701px) and (max-width:768px){ html { font-size: 7.68px; } }*/
@media only screen and (min-width:769px) and (max-width:800px){ html { font-size: 8px; } }
@media only screen and (min-width:801px) and (max-width:900px){ html { font-size: 9px; } }
@media only screen and (min-width:901px) and (max-width:1000px){ html { font-size: 10px; } }
@media only screen and (min-width:1001px) and (max-width:1100px){ html { font-size: 11px; } }
@media only screen and (min-width:1101px) and (max-width:1200px){ html { font-size: 12px; } }
@media only screen and (min-width:1201px) and (max-width:1300px){ html { font-size: 13px; } }
@media only screen and (min-width:1301px) and (max-width:1400px){ html { font-size: 14px; } }
@media only screen and (min-width:1401px) and (max-width:1500px){ html { font-size: 15px; } }
@media only screen and (min-width:1501px) and (max-width:1600px){ html { font-size: 16px; } }
@media only screen and (min-width:1601px) and (max-width:1700px){ html { font-size: 17px; } }
@media only screen and (min-width:1701px) and (max-width:1800px){ html { font-size: 18px; } }
@media only screen and (min-width:1801px) and (max-width:1900px){ html { font-size: 19px; } }
@media only screen and (min-width:1901px) and (max-width:2000px){ html { font-size: 20px; } }
@media only screen and (min-width:2001px) and (max-width:2100px){ html { font-size: 21px; } }
@media only screen and (min-width:2101px) and (max-width:2200px){ html { font-size: 22px; } }
@media only screen and (min-width:2201px) and (max-width:2300px){ html { font-size: 23px; } }
@media only screen and (min-width:2301px) and (max-width:2400px){ html { font-size: 24px; } }
@media only screen and (min-width:2401px) and (max-width:2500px){ html { font-size: 25px; } }
@media only screen and (min-width:2501px) and (max-width:2600px){ html { font-size: 26px; } }
@media only screen and (min-width:2601px) and (max-width:2700px){ html { font-size: 27px; } }
@media only screen and (min-width:2701px) and (max-width:2800px){ html { font-size: 28px; } }
@media only screen and (min-width:2801px) and (max-width:2900px){ html { font-size: 29px; } }
@media only screen and (min-width:2901px) and (max-width:3000px){ html { font-size: 30px; } }
@media only screen and (min-width:3001px) and (max-width:3100px){ html { font-size: 31px; } }
@media only screen and (min-width:3101px) and (max-width:3200px){ html { font-size: 32px; } }
@media only screen and (min-width:3201px) and (max-width:3300px){ html { font-size: 33px; } }
@media only screen and (min-width:3301px) and (max-width:3400px){ html { font-size: 34px; } }
@media only screen and (min-width:3401px) and (max-width:3500px){ html { font-size: 35px; } }
@media only screen and (min-width:3501px) and (max-width:3600px){ html { font-size: 36px; } }
@media only screen and (min-width:3601px) and (max-width:3700px){ html { font-size: 37px; } }
@media only screen and (min-width:3701px) and (max-width:3800px){ html { font-size: 38px; } }
@media only screen and (min-width:3801px){ html { font-size: 38.4px; } }

/* Responsive <html> font size mobile_version_1 ((Viewport-width / 100) x 3) */
@media only screen and (max-width:320px) { html.mobile_version_1 { font-size: 9.6px; }  }
@media only screen and (min-width:321px) and (max-width:400px){ html.mobile_version_1 { font-size: 12px; } }
@media only screen and (min-width:401px) and (max-width:500px){ html.mobile_version_1 { font-size: 15px; } }
@media only screen and (min-width:501px) and (max-width:600px){ html.mobile_version_1 { font-size: 18px; } }
@media only screen and (min-width:601px) and (max-width:700px){ html.mobile_version_1 { font-size: 21px; } }
@media only screen and (min-width:701px) and (max-width:768px){ html.mobile_version_1 { font-size: 23.04px; } }
