html, body {
	padding: 0;
	margin: 0;
	background: #ffffff;
}

a {
	color: #5586C5;
}

#logo {
	height: 13em;
	outline: none;
	border: 0;
}

.sidebar {
	color: #004988;
	line-height: 2em;
	width: 18em;
	background: #9BC2F7;
	top: 0;
	bottom: 0;
	position: fixed;
	border-right: 1px solid #707070;
	font-family: sans-serif;
	overflow-y: auto;
	overflow-y: overlay;
	-ms-overflow-style: -ms-autohiding-scrollbar;
	text-align: center;
}

.sidebar h1 {
	color: #5586C5;
	font-size: 3em;
	padding: 0;
	margin-top: 1em;
	font-family: sans-serif;
	margin-bottom: 0.3em;	
}

.sidebar h1 #bt {
	color: #FFFFFF;
}

.sidebar h1 a {
	text-decoration: none;
	color: #5586c5;
}

.sidebar h2 {
	color: #404E5C;
	font-size: 2em;
}

.sidebar h2 a {
	text-decoration: none;
	color: inherit;
}

.sidebar h3 {
	color: #404E5C;
	margin-bottom: 0;
	margin-top: 0;
}

.sidebar h3 a {
	text-decoration: none;
	color: inherit;
}

.main {
	color: #404E5C;
	left: 19em;
	margin-right: 19em;
	font-family: sans-serif;
	min-height: 100%;
	left: 19em;
	position: relative;
}

.main .body {
	margin: 3em 3em 3em 2em;
}

.main .footer {
	right: 0;
	left: 0;
	bottom: 0;
	padding: 1em 3em 0.2em 2em;
}

.main .footer div {
	font-size: 0.7em;
	color: #999;
}

.main .footer .topFooterDiv {
	border-top: 1px solid #aaa;
	padding-top: 0.75em;
	text-align: right;
}

.main div {
	padding-bottom: 0.75em;
}

.main li {
	padding-bottom: 1em;
}

.news-items {
    height: 15em;
    overflow: auto;
}

.btn-div {
	text-align: center;
	padding-top: 2em;
}

.btn-div .smaller {
	font-size: 80%;
	padding-top: 0.5em;
}

.installers {
	padding: 0 0 0 0;
}

.installers .col1 {
	padding: 0 0 0 0;
}

.installers .col2 {
	padding: 0.5em 0 2em 2em;
	font-size: 0.8em;
}

.btn {
	background: #5586C5;
	-webkit-border-radius: 28;
	-moz-border-radius: 28;
	border-radius: 28px;
	font-family: Arial;
	color: #ffffff;
	font-size: 20px;
	padding: 6px 30px 6px 30px;
	text-decoration: none;
	display: inline-block;
}

.btn:hover {
	background: #9BC2F7;
	text-decoration: none;
}

pre {
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
}

.cara {
	width: 90%;
	text-align: center;
	overflow: hidden;
	display: flex;
}

.slides {
	display: flex;
	overflow-x: hidden;
	scroll-snap-type: x mandatory;
	
	scroll-behavior: smooth;
  	-webkit-overflow-scrolling: touch;

}

.slides > div {
	flex-shrink: 0;
	width: 100%;
	max-height: 800px;
	position: relative;
	
	display: flex;
	justify-content: center;
	align-items: center;
	
	scroll-snap-align: start;
	transform-origin: center center;
  	transform: scale(1);
  	transition: transform 0.5s;
}

.img-responsive {
	max-width: 90%;
	max-height: 800px;
}

.imgCaption {
	color: #404E5C;
}

.slides a {
	text-decoration: none;
}
	

.main h3 {
	font-size: 1.75em;
}

.about-container {
	display: flex;
}

.about {
	padding-right: 20px;
}

.mobileMenuIcons {
	display: none;
}

@media (max-width: 55em) {
	#logo {
		width: 8em;
		height: 8em;
	}
	.sidebar {
		width: 2em;
		padding: 0.5em;
		line-height: 1.5em;
		z-index: 1;
	}
	.fullMenu {
		display: none;
	}
	.mobileMenuIcons {
		display: block;
		width: 100%;
		height: 50px;
	}
	.hamburger {
		max-width:80%;
	}
	.cross {
		width: 25px;
		float: left;
	}
	.crossIcon {
		display: none;
	}
	.arrow {
		max-width: 4%;
		padding-bottom: 30px;
	}
	.slides {
		overflow: hidden;
	}
	.sidebar h1 {
		font-size: 1.9em;
	}
	.sidebar h3 {
		font-size: 0.8em;
		font-weight: normal;
		margin-bottom: 0;
		margin-top: 0;
		padding-right: 0;
	}
	.main {
		left: 3em;
		margin-right: 3em;
	}
	.main .body {
		margin: 1em 1em 1em 1em;
	}
	.main .footer {
		padding: 1em 1em 0.2em 1em;
	}
	.sidebar h2 {
		padding-right: 0em;
		font-size: 1.5em;
	}
	.main ul {
		padding-left: 0.7em;
	}
	.main li {
		padding-bottom: 1em;
		list-style: none;
		text-indent: -.6em;
	}
	.main li:before {
		content: '\2022\a0';
	}
	.img-responsive {
		max-width: 90%;
		border: inherit;
	}
	.minSidebar.sidebar {
		width: 2em;
	}
	.minSidebar .fullMenu {
		display: none;
	}
	.minSidebar .hamburgerIcon {
		display: block;
	}
	.minSidebar .crossIcon {
		display: none;
	}
	.showSidebar.sidebar {
		width: 10em;
	}
	.showSidebar .fullMenu {
		display: block;
	}
	.showSidebar .hamburgerIcon {
		display: none;
	}
	.showSidebar .crossIcon {
		display: block;
	}
}

@media screen and (prefers-color-scheme: light) {
    html, body { background: #ffffff; }
    
    a { color: #5586C5; }

    .sidebar {
        color: #004988;
        background: #9BC2F7;
        border-right-color: #707070;
    }

    .sidebar h1 { color: #5586C5; }
    .sidebar h1 #bt { color: #FFFFFF; }
    .sidebar h1 a { color: #5586c5; }
    .sidebar h2 { color: #404E5C; }
    .sidebar h3 { color: #404E5C; }

    .main { color: #404E5C; }
    .main .footer div { color: #999; }
    .main .footer .topFooterDiv { border-top-color: #aaa; }

    .btn {
        background: #5586C5;
        color: #ffffff;
    }
    .btn:hover { background: #9BC2F7; }
    .imgCaption { color: #404E5C; }
}

@media screen and (prefers-color-scheme: dark) {
    html, body { background: #181a1b; }
    
    a { color: #b7b0a7; }
    a:hover { color: #ddd; }

    .sidebar {
        color: rgb(122, 197, 255);
        background: rgb(9, 50, 107);
        border-right-color: rgb(103, 96, 85);
    }

    .sidebar h1 { color: rgb(98, 153, 201); }
    .sidebar h1 #bt { color: rgb(232, 230, 227); }
    .sidebar h1 a { color: rgb(98, 153, 201); }
    .sidebar h2 { color: rgb(183, 176, 167); }
    .sidebar h3 { color: rgb(183, 176, 167); }
    .sidebar a:hover { color: #eee; }

    .main { color: rgb(183, 176, 167); }
    .main .footer div { color: rgb(168, 160, 149); }
    .main .footer .topFooterDiv { border-top-color: rgb(72, 78, 81); }

    .btn {
        background: rgb(48, 88, 140);
        color: rgb(232, 230, 227);
    }
    .btn:hover { background: rgb(9, 50, 107); }
    .imgCaption { color: rgb(183, 176, 167); }
}