body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
/*body, html {
  width: 100vw;
  height: 100vh;
  color: #777;
  line-height: 1.8;
}
*/

h5 { margin:0; padding:0 4px; font-family: "Lato", sans-serif; font-weight: bold; font-size: 1.2em; background-color: #e0e0e0; border-radius: 5px; text-align:center }
h6 { margin:0; padding:0; font-family: "Lato", sans-serif; font-size: 1em; text-align:left; font-weight: bolder;}

/* Create a Parallax Effect */
.bgimg-1, .bgimg-2, .bgimg-3 {
  background-attachment: scroll;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* First image (Logo. Full height) */
.bgimg-1 {
  background-image: url('/images/main-image.jpg');
  height: calc(100vh - 2em);
  min-height: calc(100vh - 2em);
}

/* Second image (Portfolio) */
.bgimg-2 {
  background-image: url("/images/signup.jpg");
  min-height: 400px;
}

/* Third image (Contact) */
.bgimg-3 {
  background-image: url("/images/aboutus.jpg");
  min-height: 400px;
}

.aoimg-0 {
  background-image: linear-gradient(rgba(255, 255, 255, 0.5),rgba(255, 255, 255, 0.5)), url("/images/ao0.jpg");
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: right;
  background-color: gray;
  background-blend-mode: luminosity;
}
.aoimg-0.optsel {
  background-color: transparent;
  background-size: auto 100%;
}
.aoimg-1 {
  background-image: linear-gradient(rgba(255, 255, 255, 0.5),rgba(255, 255, 255, 0.5)), url("/images/ao1.jpg");
  background-repeat: no-repeat;
  background-size:100% auto;
  background-position: right;
  background-color: gray;
  background-blend-mode: luminosity;
}
.aoimg-1.optsel {
  background-color: transparent;
  background-size: auto 100%;
}

li div { color: #b0b0b0 }

button {
	position:relative;
	display:inline-block;
	padding:8px 10px; 
	border: none;
	width: 150px; 
	color:white;
	z-Index:1;
}

.w3-wide {letter-spacing: 10px;}
.w3-hover-opacity {cursor: pointer;}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

/* Turn off parallax scrolling for tablets and phones */
@media only screen and (max-device-width: 1600px) {
  .bgimg-1, .bgimg-2, .bgimg-3 {
    background-attachment: scroll;
    min-height: 400px;
  }
}
@media (max-width: 800px) {
	#signup_form {
		left:0;
		top:0;
		right:0;
		bottom:0;
		width:100%;
	}
	.algn-center-xy {
	position: absolute;
	left: 0;
	top: 0;
	-ms-transform: none;
	transform: none;	
	}
  .aoimg-0 {
    background-position: center;
  }
  .aoimg-1 {
    background-position: center;
  }
}