body, html {
	margin:0px;
	padding:0px;
}

body {
	background: transparent;
	font-family: 'Roboto', segoe ui, verdana, arial, sans-serif;

	/*overflow-x: hidden;*/
	padding-top:63px;
}


h1 {
	font-weight: 200;
	padding-top:15px;
}

h2 {
	font-weight: 200;
	margin-top:35px;
}

h3 {
	font-weight: 200;
}


.navbar {
	border-bottom: 1px solid #e1e1e1 !important;
}

@media (max-width: 992px) {
	.navbar .navbar-nav > li > a.btn { margin-bottom:4px; }
}

@media (min-width: 992px) {
	.navbar .navbar-nav > li > a.btn { margin-right:4px; margin-left:18px; }
}

.navbar .navbar-nav > li > a.btn-primary { color:#fff; background-color:#598bd0; border:0px; }
.navbar .navbar-nav > li > a.btn-primary:hover,
.navbar .navbar-nav > li > a.btn-primary:focus
{ background-color:#527eba; color: #fff; }

.navbar .navbar-nav > li > a.btn-success { color:#fff; background-color:#66cc66; border:0px; }
.navbar .navbar-nav > li > a.btn-success:hover,
.navbar .navbar-nav > li > a.btn-success:focus
{ background-color:#52a352; color: #fff; }



/* Slides
--------------------------------------------------------------------------- */

.frontpage-sider-outer {
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	background-size: cover !important;
}


.cycle-slideshow {
	height: auto;
}

.frontpage-slide {
	width: 100%;
	height: 600px;	
}

.frontpage-slide-inner {
	border: 0px solid blue;
	width: 100%;
	height: 100%;

	text-align: center;
	padding-top:8%;
	color:#000;
}


.landing-page.slide1 {
	position: relative;
	height: 100%;
}

.landing-page.slide1 .inner {
	background-image: url("/webpage/images/top_bg.svg");
	background-repeat: no-repeat;
	background-position: right top;
	background-size: auto 100%;
}

.landing-page.slide1 .cover-content { display: flex; flex-direction: row; }
.landing-page.slide1 .cover-content .left { flex: 0 0 50%; }
.landing-page.slide1 .cover-content .right { flex: 0 0 50%; }

.landing-page.slide1 .inner img.sofa {
	position: absolute;
	width: 700px;
	right:0;
	bottom:0;
	margin: 0px 50px 0px 0px;
	z-index: 51;
}
.landing-page.slide1 .inner img.monitor {
	position: absolute;
	width: 300px;
	border: 2px solid #000;
	right:0;
	bottom:0;
	/* margin-right: 160px;
	margin-bottom: 350px; */
	margin: 0px 160px 350px 0px;
	z-index: 50;
}

.frontpage-slide-inner .headline { font-weight:200; }
.frontpage-slide-inner .headline-sub { font-weight:200; }

/*.frontpage-slide-btns {
	position:relative;
	z-index: 700;
}*/

@media only screen and (max-width : 1200px) {
	.frontpage-slide { height:500px; }
	.frontpage-slide-inner {
		padding-top:5%;
		padding-bottom:8%;
	}

	.landing-page.slide1 .inner img.sofa { width: 500px !important; margin: 0px 50px 0px 0px !important; }
	.landing-page.slide1 .inner img.monitor { width: 230px !important; margin: 0px 130px 230px 0px !important; }
}


@media only screen and (max-width : 768px) {
	.frontpage-slide { height:auto; }
	.frontpage-slide-inner {
		padding-top:3%;
		padding-bottom:20%;
	}

	.landing-page.slide1 .inner img.sofa { width: 300px !important; margin: 0px 50px 0px 0px !important; }
	.landing-page.slide1 .inner img.monitor { width: 230px !important; margin: 0px 80px 240px 0px !important; }
}

/* @media only screen and (max-width : 480px) { */
@media only screen and (max-width : 500px) {
	.frontpage-slide { height:auto; }
	.frontpage-slide-inner {
		padding-top:3%;
		padding-bottom:20%;
	}

	.landing-page.slide1 .cover-content { flex-direction: column !important; }
	.landing-page.slide1 .cover-content .left { flex: 1 1 100% !important; }
	.landing-page.slide1 .cover-content .right { display:none; flex: 1 1 100% !important;}
}

/* Custom Media Queries */ 
@media only screen and (max-width : 320px) {
	.frontpage-slide { height:auto; }
	.frontpage-slide-inner {
		padding-top:3%;
		padding-bottom:20%;
	}
}





@media only screen and (min-width: 0px) {
	.dynamic-fontsize-xxxxxxxxl { font-size: 110px; }
	.dynamic-fontsize-xxxxxxxl { font-size: 100px; }
	.dynamic-fontsize-xxxxxxl { font-size: 90px; }
	.dynamic-fontsize-xxxxxl { font-size: 80px; }
	.dynamic-fontsize-xxxxl { font-size: 70px; }
	.dynamic-fontsize-xxxl { font-size: 60px; }
	.dynamic-fontsize-xxl { font-size: 50px; }
	.dynamic-fontsize-xl { font-size: 30px; }
	.dynamic-fontsize-lg { font-size: 20px; }
	.dynamic-fontsize-md { font-size: 15px; }
	.dynamic-fontsize-sm { font-size: 13px; }
	.dynamic-fontsize-xs { font-size: 10px; }
}


@media only screen and (min-width: 500px) {
	.dynamic-fontsize-xxxxxxxxl { font-size: 110px; }
	.dynamic-fontsize-xxxxxxxl { font-size: 100px; }
	.dynamic-fontsize-xxxxxxl { font-size: 90px; }
	.dynamic-fontsize-xxxxxl { font-size: 80px; }
	.dynamic-fontsize-xxxxl { font-size: 70px; }
	.dynamic-fontsize-xxxl { font-size: 60px; }
	.dynamic-fontsize-xxl { font-size: 50px; }
	.dynamic-fontsize-xl { font-size: 30px; }
	.dynamic-fontsize-lg { font-size: 20px; }
	.dynamic-fontsize-md { font-size: 15px; }
	.dynamic-fontsize-sm { font-size: 13px; }
	.dynamic-fontsize-xs { font-size: 10px; }
}


@media only screen and (min-width: 700px) {
	.dynamic-fontsize-xxxxxxxxl { font-size: 120px; }
	.dynamic-fontsize-xxxxxxxl { font-size: 110px; }
	.dynamic-fontsize-xxxxxxl { font-size: 100px; }
	.dynamic-fontsize-xxxxxl { font-size: 90px; }
	.dynamic-fontsize-xxxxl { font-size: 80px; }
	.dynamic-fontsize-xxxl { font-size: 70px; }
	.dynamic-fontsize-xxl { font-size: 60px; }
	.dynamic-fontsize-xl { font-size: 40px; }
	.dynamic-fontsize-lg { font-size: 30px; }
	.dynamic-fontsize-md { font-size: 16px; }
	.dynamic-fontsize-sm { font-size: 12px; }
	.dynamic-fontsize-xs { font-size: 10px; }
}


@media only screen and (min-width: 1024px) {
	.dynamic-fontsize-xxxxxxxxl { font-size: 120px; }
	.dynamic-fontsize-xxxxxxxl { font-size: 110px; }
	.dynamic-fontsize-xxxxxxl { font-size: 100px; }
	.dynamic-fontsize-xxxxxl { font-size: 90px; }
	.dynamic-fontsize-xxxxl { font-size: 80px; }
	.dynamic-fontsize-xxxl { font-size: 70px; }
	.dynamic-fontsize-xxl { font-size: 60px; }
	.dynamic-fontsize-xl { font-size: 50px; }
	.dynamic-fontsize-lg { font-size: 40px; }
	.dynamic-fontsize-md { font-size: 25px; }
	.dynamic-fontsize-sm { font-size: 18px; }
	.dynamic-fontsize-xs { font-size: 13px; }
}


@media only screen and (min-width: 1500px) {
	.dynamic-fontsize-xxxxxxxxl { font-size: 130px; }
	.dynamic-fontsize-xxxxxxxl { font-size: 120px; }
	.dynamic-fontsize-xxxxxxl { font-size: 110px; }
	.dynamic-fontsize-xxxxxl { font-size: 100px; }
	.dynamic-fontsize-xxxxl { font-size: 90px; }
	.dynamic-fontsize-xxxl { font-size: 80px; }
	.dynamic-fontsize-xxl { font-size: 70px; }
	.dynamic-fontsize-xl { font-size: 60px; }
	.dynamic-fontsize-lg { font-size: 50px; }
	.dynamic-fontsize-md { font-size: 35px; }
	.dynamic-fontsize-sm { font-size: 25px; }
	.dynamic-fontsize-xs { font-size: 18px; }
}




.frontpage-slide-btns .btn2 {
	display: inline-block;
	min-width: 180px;
	padding: 8px 15px;
	border-radius: 4px;
	font-size: 18px;
	font-weight: 400;
	margin: 4px;
}

.frontpage-slide-btns .btn2:hover { text-decoration:none; }

.frontpage-slide-btns .btn2-default { color:#545454; background-color:#fff; }
.frontpage-slide-btns .btn2-default:hover { color:#545454; background-color:#fff; }

.frontpage-slide-btns .btn2-primary { color:#fff; background-color:#598bd0; }
.frontpage-slide-btns .btn2-primary:hover { color:#fff; background-color:#4479c3; }

.frontpage-slide-btns .btn2-success { color:#fff; background-color:#66cc66; }
.frontpage-slide-btns .btn2-success:hover { color:#fff; background-color:#48c248; }

.frontpage-slide-btns .btn2-danger { color:#fff; background-color:#e96480; }
.frontpage-slide-btns .btn2-danger:hover { color:#fff; background-color:#dd4565; }







/* Slide prev/next buttons
--------------------------------------------------------------------------- */

.prev-next-controls {
	position: absolute;
	font-size: 60px;
	width: 100%;
	color:#939393;
	margin-top:-350px;
	z-index: 999;
}

.prev-next-controls .prevControl {
	position:relative;
	z-index: 600;
	float:left;
	/*margin-top:-50%;*/
	cursor: pointer;
	margin-left:20px;
	padding:5px 15px;
}

.prev-next-controls .nextControl {
	position:relative;
	z-index: 600;
	float:right;
	cursor: pointer;
	margin-right:20px;
	padding:5px 15px;
}

/* Custom Media Queries */ 
@media only screen and (min-width : 320px) {
	.prev-next-controls {
		display: none;
	}
}

@media only screen and (min-width : 480px) {
	.prev-next-controls {
		display: none;
	}
}

@media only screen and (min-width : 768px) {
	.prev-next-controls {
		display: none;
	}
}

@media only screen and (min-width : 1200px) {
	.prev-next-controls {
		display: block;
		margin-top:-350px;
	}
}









/* Slide pager icons/btns
--------------------------------------------------------------------------- */
.cycle-pager { 
    text-align:center; width: 100%; z-index: 500; position:relative; overflow: hidden; margin-top:-70px;
}
.cycle-pager span { 
    font-family: arial; font-size: 50px; width: 16px; height: 16px; 
    display: inline-block; color: #fff; cursor: pointer; 
}
.cycle-pager span.cycle-pager-active { color: #1e97e3;}
.cycle-pager > * { cursor: pointer;}





.page-content {
	margin-top:0px;
	padding-bottom: 100px;
}

.breadcrumb {
	background-color: #fff;
	font-size: 12px;
}



.footer {
	width: 100%;
	/*background-color: #1e97e3;*/
	background-color: #dbdbdb;
	min-height: 280px;
	margin-top:35px;
}

.footer h3 { margin-top:0px; margin-bottom:15px; font-weight:200; }

.footer-inner {
	padding: 15px 8px;
	color:#616161;
}

.footer-inner a { color:#616161; border-bottom:1px dotted #616161; }
.footer-inner a.no-border { border-bottom:0px; }
.footer-inner a:hover { color:#608cc7; text-decoration:none; }

.footer-inner ul { list-style-type:none; margin:0px; padding:0px; }


@media only screen and (max-width : 992px) {
	#footer-social {
		text-align: center;
		margin-top: 15%;
	}
}






#load-layer {
	display: none;
	/* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 99999; /* Sit on top */
    left: 0;
    top: 0;
    margin-top: 65px;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(255, 255, 255, 0.9); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}


.help {
	color: #808080;
	font-size:12px;
	padding:6px;
}





a {
	-o-transition:color .2s ease-out, background 0.2s ease-in;
	-ms-transition:color .2s ease-out, background 0.2s ease-in;
	-moz-transition:color .2s ease-out, background 0.2s ease-in;
	-webkit-transition:color .2s ease-out, background 0.2s ease-in;
	/* ...and now override with proper CSS property */
	transition:color .2s ease-out, background 0.2s ease-in;
}


.modal-content { border-radius: 0px; }

.btn* {
  border-radius: 0 !important;
}



.content-blocks { text-align:center; }
.content-blocks .content-blocks-inner { padding:70px 5%; }
.content-blocks .row { margin-top:55px; }
.content-blocks h1 { font-size:50px; font-weight:200; }
.content-blocks h2 { font-size:30px; font-weight:200; }
.content-blocks .icon { font-size:60px; }
.content-blocks .header { font-size:25px; }
.content-blocks .description { margin-top:15px; }

.content-blocks.content-dark a { color:#8cb5ed; }
.content-blocks.content-dark a:hover { color:#8cb5ed; text-decoration:none; border-bottom:1px dotted; }

.content-block-left { text-align:left; }
.content-block-right { text-align:right; }


@media only screen and (max-width : 992px) {
	.content-blocks h1 { font-size:30px; font-weight:200; }
	.content-blocks h2 { font-size:22px; font-weight:200; }
	
	.home-templates-center { display:none; }
	
	.content-block-left { text-align:center; }
	.content-block-right { text-align:center; }
}

/*@media only screen and (max-width : 768px) {
	.home-templates-center { display:block; }
}*/




.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/* Templates
--------------------------------------------------------------------------- */

.home-templates .icon {
	text-align: center;
}
.home-templates .fa {
	font-size: 50px;
}
.home-templates-center {
	padding-top: 10%;
}

@media only screen and (max-width : 768px) {
	.content-blocks h1 { font-size:30px; font-weight:200; }
	.content-blocks h2 { font-size:22px; font-weight:200; }
}




/* Functions
--------------------------------------------------------------------------- */
#functions .title { font-size:22px; font-weight:200; margin-top:4%; }


/* Prices
--------------------------------------------------------------------------- */

#prices a.prices-link { color:#98d2f7 !important; font-size:18px; }
#prices a.prices-link { color:#fff; }





/* Tiles
--------------------------------------------------------------------------- */

.tile {
	display: inline-block;
	background-color: rgba(74,85,89,0.5);
	color: #fff;
	width: 130px;
	height: 130px;
	margin-right: 2.5px;
	margin-bottom: 6px;
	outline: 3px solid transparent;
	padding:10px;
	font-weight:100;
	text-decoration: none;
	position: relative;
	vertical-align: top;
}
.tile:hover { outline: 3px solid rgba(132, 132, 132, 0.2); color:#fff; text-decoration:none; }
.tile .badge { position:absolute; z-index:9999; right:0; margin-top:-15px; margin-right:-5px; font-size:16px; border-radius:50%; padding:6px 6px 3px 6px; min-width:28px; height:28px; text-align:center; }

.tile span.tile-icon { display:block; text-align:center; height:85px; padding-top:10px; }
.tile span.tile-icon img { width: 55%; }
.tile span.tile-icon .fa, .tile span.tile-icon .far, .tile span.tile-icon .fal, .tile span.tile-icon .fas, .tile span.tile-icon .fab { font-size:65px; padding-top:5px; }
.tile span.tile-icon .svg-inline--fa { font-size:65px; padding-top:5px; }
.tile .tile-icon-text-lg { text-align:center; display:block; font-size:40px; }
.tile span.tile-title, .tile span.title { margin:10px 0px 0px 0px; display:block; font-size:15px; width:110px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tile span.tile-title-md { font-size:18px; margin-top:-6px; }
.tile span.tile-title-corner { float:right; margin-top:-110px; margin-right:6px; font-size: 12px; }
.tile span.value { display:block; font-size:40px; padding-top:10px; }
.tile span.unit { font-size:20px; }

/* Tile small */
.tile-sm { width: 100px; height: 100px; }
.tile-sm span.tile-icon { height:65px; padding-top:7px; }
.tile-sm span.tile-icon .fa, .tile span.tile-icon .far, .tile span.tile-icon .fal, .tile span.tile-icon .fas, .tile span.tile-icon .fab { font-size:55px; }
.tile-sm span.tile-title, .tile span.title { margin-top:0px; font-size:14px; width:85px; }

/* Tile 2x (2x wide) */
.tile-2x { width:267px; }
.tile-2x span.tile-title, .tile-2x span.title { width:260px; }
.tile-2x span.tile-icon { text-align:left; height:85px; padding-top:10px; }
.tile-2x span.tile-icon img { height: 65px; width:auto; padding-top:0px; margin-left:5px; }
.tile-2x span.tile-icon .fa, .tile-2x span.tile-icon .far, .tile-2x span.tile-icon .fal, .tile-2x span.tile-icon .fas, .tile-2x span.tile-icon .fab { font-size:60px; padding-top:0px; margin-left:10px; }
.tile-2x span.tile-icon .svg-inline--fa { font-size:60px; }


/* Tile 4x (2x wide and 2x height) */
.tile-4x { width:267px; height:267px; }
.tile-4x span.tile-title, .tile-4x span.title { width:260px; }
.tile-4x span.tile-icon { height:200px; padding-top:6px; }
.tile-4x span.tile-icon img { width:55%; padding-top:20px; }
.tile-4x span.tile-icon .fa, .tile-4x span.tile-icon .far, .tile-4x span.tile-icon .fal, .tile-4x span.tile-icon .fas, .tile-4x span.tile-icon .fab { font-size:120px; padding-top:25px; }
.tile-4x span.tile-icon .svg-inline--fa { font-size:170px; padding-top:25px; }
.tile-4x span.tile-title { font-size:15px; font-weight:100; width:200px; margin-top:27px; }

/* Tile full width */
.tile-full-width { width:100%; }
.tile-full-width span.tile-icon { float:left; }
.tile-full-width span.tile-icon img { width:30px; width:auto; }
.tile-full-width span.tile-icon .fa, .tile-full-width span.tile-icon .far, .tile-full-width span.tile-icon .fal, .tile-full-width span.tile-icon .fas, .tile-full-width span.tile-icon .fab { font-size:40px; padding:5px; }
.tile-full-width span.tile-icon .mdi { font-size:40px; padding:0px 13px; }
.tile-full-width span.tile-icon .badge { font-size: 30px; margin-top:7px; margin-left:15px; }
.tile-full-width span.tile-icon-number { display:block; font-size:35px; font-weight:bold; margin-top:5px; }
.tile-full-width span.tile-title { display:block; font-size:20px; margin-left:0px; margin-top:18px; width:auto; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.tile-low-height { height:80px; }
.tile-low-height span.tile-icon img { height:45px; }

/* Tile colors */
.tile-lightblue { background-color: #88aebe }
.tile-blue { background-color: #0a5ac3; color:#fff !important; }
.tile-blue:hover { color:#fff; }
.tile-darkblue { background-color: #0b335e; color:#fff; }
.tile-navy { background-color: #5f7978 }
.tile-green { background-color: #00a400 }
.tile-lightred { background-color: #b9513e }
.tile-red { background-color: #b9090b; color:#fff !important; }
.tile-purple { background-color: #5535af; }
.tile-lightpurple { background-color: #bf56bc; }
.tile-gray { background-color: #5d5d5d }
.tile-gray:hover { color:#fff; }
.tile-dark { background-color: #1f1f1f }
.tile-red { background-color: #b9090b }
.tile-orange { background-color: #d44a27 }
.tile-orange:hover { background-color: #CB3915; color:#fff; }
.tile-lightorange { background-color: #d9712b }
.tile-yellow { background-color: #f4f71b; color:#4d4d4d; }
.tile-yellow:hover { color:#4d4d4d !important; }
.tile-lightyellow { background-color: #c7b05e; color:#4d4d4d; }
.tile-white { background-color: #fff; color:#272b2c; border:1px solid #eaeaea; }
.tile-white:hover { color:#23363e !important; }



/* Thumbnails
--------------------------------------------------------------------------- */
.fuThumbnail {
	margin:6px;
	display: inline-block;
	outline: 3px solid transparent;
	background-color: #fff;
	border-radius: 5px;
	width: 140px;
}

.fuThumbnail:hover {
	outline: 3px solid rgba(132, 132, 132, 0.2);
	text-decoration: none;
}

.fuThumbnail img {
	width: 100%;
	padding:5px;
}