html,
body {
	font-size: 1em;
}
h1,h2 {
font-weight:200;
}
.top {
	background-image: url('/img/bg.jpeg');
	background-position: center;
	background-size: cover;
}

.top .jumbotron {
	margin: 4rem auto;
	background: rgba(255, 255, 255, 0.70);
	color: #0675a8;
	font-family: "Raleway", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
	font-weight: bold;
}

.jumbotron h1 {
	color: #0891d1;
	font-weight: bold;
	font-size: 4rem;
}

.jumbotron h1 img{
	height: 8.125rem;
}

.under-logo {
	padding-left: 9.3rem;
}

.xcontainer > .row {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
}

.navbar {border-radius: 0px;}
.navbar .container {width: 100%;}
.navbar .navbar-brand {white-space:nowrap;padding-top:10px;}
.navbar .navbar-brand img{display:block-inline;max-height:36px;display:inline-block;}
.navbar .navbar-brand .brandName{display:inline-block;padding-left:12px;color:#fff;font-weight:200;}
.navbar .navbar-brand .brandSep{border-left:1px solid rgba(255,255,255,0.1);border-right:1px solid rgba(0,0,0,0.3);display:block-inline;height:30px;margin-left:7px;}


.formhdr {
  padding: 19px 0px 0px;
  margin-bottom: 30px;
  background-color: #f5f5f5;
  border-bottom: 1px solid #e5e5e5;
}
.formsave {
  padding: 19px 0px 0px;
  margin-top: 30px;
  background-color: #f5f5f5;
  border-top: 1px solid #e5e5e5;
}

@media (max-width: 630px) {
	.top .container{
		margin: 0;
		padding: 0;
	}
	.container .jumbotron{
		border-radius: 0;
	}

	.jumbotron h1 {
		font-size: 3rem;
	}

	.jumbotron h1 img{
		height: 4rem;
	}

	.under-logo {
		padding-left: 0rem;
	}
}

/*
Breakpoint: viewport too narrow for two-column, go to one column (as per bootstrap CSS)
*/
@media (max-width:768px) {
	.top {
		background-image: url('/img/bg.jpeg');
	}

	/* Lets make the images fill up the entire viewport so we can actually see them. */
	.img-thumbnail {
		width: 100%;
	}

	/* Measure of the introductory text becomes too narrow. Widen it. */
	.top .jumbotron #under-logo {
		padding-left: 0;
		margin-top: 20px;
	}
}

/* Sly */
.calsly {
	position: relative;
	margin: 10px 0;
}
.calsly .frame {
	height: 80px;
	line-height: 80px;
	overflow: hidden;
}
.calsly .frame ul {
	list-style: none;
	margin: 0;
	padding: 0;
	height: 100%;
	font-size: 20px;
}
.calsly .frame ul li {
	float: left;
	width: 117px;
	height: 100%;
	margin: 0 1px 0 0;
	padding: 0;
	background: #333;
	color: #ddd;
	text-align: center;
	cursor: pointer;
}
.calsly .frame ul li.active {
	color: #fff;
	background: #a03232;
}
.calsly button, .calsly button { background: transparent; border: 0; xcolor: #fff; opacity: .5; }
.calsly button:hover, .calsly button:hover { opacity: 1; }
.calsly button:disabled, .calsly button:disabled { opacity: .2; }
.calsly .forward, .calsly .backward { float: left; width: 40px; height: 80px; font-size: 20px; }
.calsly .forward { float: right; }