body {
	background-image: url("../images/bg-pattern.jpg");
	background-repeat: repeat;
	font-family: 'Open Sans', sans-serif;
}

.unselectable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/*
** All
*/

.outer-buffer {
	display: inline-block;
	min-width: 100px;
	width: 10%;
}

.outer-container {
	display: inline-block;
	position: absolute;
	width: 80%;
}

.inner-container {
	height: 100%;
	margin: 10px auto 0px auto;
	max-width: 1200px;
	min-width: 1200px;
	width: 80%;
}


/*
** Navigation Header Section
*/

.nav-header{
	/*background-color: #CDCDCD;*/
	background-image: url("../images/med-chruch.png");
	background-size: 50px;
	box-shadow: 0px 1px 1px #888;
	height: 100px;
	width: 100%;
}

.title-header {
	background-image: url("../images/dark-chruch.png");
	background-size: 100px;
	color: #888;
	float: right;
	font-size: 36px;
	font-weight: bold;
	height: auto;
	margin: 0px;
	padding: 30.5px 44px;
	cursor: default;
}

.nav-items {
	padding: 0px;
	float: right;
	height: 100%;
	list-style: none;
}

.nav-item {
	display: inline-block;
	padding: 37.5px 0px;
	position: relative;
	cursor: pointer;
}

.nav-item:hover {
	background-color: #888;
	box-shadow: inset 0px 0px 50px 0px #CDCDCD;
}

.nav-item > h5 {
	background-color: transparent;
	color: #FFF;
	font-size: 18px;
	font-weight: bold;
	margin: 0px;
	padding: 37.5px 36px;
	text-align: center;
	text-decoration: none;
	text-shadow: 2px 2px 2px #AAA;
}

#nav-hdr-home {
	padding: 3.5px 24.5px;
}

#nav-hdr-about {
	padding: 3.5px 25px;
}

#nav-hdr-team {
	padding: 3.5px 26.5px;
}

#nav-hdr-docs {
	padding: 3.5px 29px;
}

/*
** The Info
*/

.info-container {
	background-image: url("../images/med-chruch.png");
	background-size: 50px;
	box-shadow: 0px 1px 1px #888;
	height: 0px;
	margin-top: 20px;
	width: 100%;
}

.slide {
	-webkit-transition: height 0.25s linear;
	-moz-transition: height 0.25s linear;
	-o-transition: height 0.25s linear;
	-ms-transition: height 0.25s linear;
	transition: height 0.25s linear;
}

.shift {
	-webkit-transition: top 0.25s linear;
	-moz-transition: top 0.25s linear;
	-o-transition: top 0.25s linear;
	-ms-transition: top 0.25s linear;
	transition: top 0.25s linear;
}

.fade {
	-webkit-transition: opacity 0.25s linear;
	-moz-transition: opacity 0.25s linear;
	-o-transition: opacity 0.25s linear;
	-ms-transition: opacity 0.25s linear;
	transition: opacity 0.25s linear;
}

 /*
 *** About
 **/

 .about-items {
 	float: center;
 	height: 750px;
 	list-style: none;
 	opacity: 0;
 	overflow: hidden;
 	padding: 0px;
 	pointer-events: none;
 	position: absolute;
 }

 #about-blurb-item {
 	height: 100px;
 	margin-bottom: 20px;
 }

 #about-blurb-item > h5 {
 	background-image: url("../images/dark-chruch.png");
 	background-size: 100px;
 	box-shadow: 1px 1px 1px 0px #888;
 	color: #999;
 	cursor: default;
 	font-size: 18px;
 	font-weight: bold;
 	height: auto;
 	line-height: 26px;
 	margin: 0px;
 	padding: 0px 12px 12px 12px;
 	text-align: left;
 	width: 100%;
 }

 #about-block-item {
 	width: 100%;
 	margin-left: 20px;
 	margin-right: 20px;
 	margin-top: 54px;
 	height: 100%;
 }

 #about-block-item > img {
 	width: 76%;
 	margin-left: 12%;
 	margin-right: 12%;
 	height: auto;
 	vertical-align: bottom;
 }

/*
 *** Docs
 **/

 .docs-items {
 	float: center;
 	height: 200px;
 	list-style: none;
 	opacity: 0;
 	overflow: hidden;
 	padding: 32px 0px;
 	pointer-events: none;
 	position: absolute;
 }

 .docs-item {
 	display: inline-block;
 	height: 100%;
 	padding: 0px 20px;
 	position: relative;
 	width: 160px;
 }

 .docs-item > div {
 	height: 100%;
 }

 .docs-item > div > a {
 	text-decoration: none;
 	-moz-user-select: none;
 	-webkit-user-select: none;
 }

 .docs-item > div > h5 {
 	background-color: transparent;
 	color: #555;
 	cursor: default;
 	font-size: 18px;
 	height: 60px;
 	margin: 0px;
 	padding: 10px 0px;
 	text-align: center;
 	text-decoration: none;
 }

 .filetype {
 	color: #555;
 	font-size: 85px;
 	height: auto;
 	margin: 0px 15%;
 	width: 70%;
 }

 .filetype:hover {
 	color: #222;
 }

/*
 *** Team
 **/

 .team-items {
 	float: center;
 	height: 200px;
 	list-style: none;
 	margin: 16px 0px;
 	opacity: 0;
 	overflow: hidden;
 	padding: 0px;
 	pointer-events: none;
 	position: absolute;
 }

 .team-item {
 	display: inline-block;
 	height: 100%;
 	padding-left: 36px;
 	position: relative;
 	width: 215px;
 	z-index: 1;
 }

 .team-pic {
 	width: 80%;
 	height: auto;
 	cursor: pointer;
 	background-image: url("../images/med-chruch.png");
 	background-size: 50px;

 	-moz-border-radius: 50%;
 	-webkit-border-radius: 50%;
 	border-radius: 50%;
 }

 .team-item > div > h5 {
 	background-color: transparent;
 	color: #333;
 	cursor: default;
 	font-size: 18px;
 	font-weight: bold;
 	height: auto;
 	margin: 0px 0px 0px -36px;
 	padding: 10px 0px;
 	text-align: center;
 	text-decoration: none;
 	z-index: 1;
 }

 .team-fill-item {
 	display: inline-block;
 	height: 100%;
 	padding: 0px;
 	position: relative;
 	vertical-align: top;
 	width: 0%;

 	-webkit-transition: width 0.25s linear;
 	-moz-transition: width 0.25s linear;
 	-o-transition: width 0.25s linear;
 	-ms-transition: width 0.25s linear;
 	transition: width 0.25s linear;
 }

 .team-fill-item > h5 {
 	background-image: url("../images/dark-chruch.png");
 	background-size: 100px;
 	box-shadow: 1px 1px 1px 0px #888;
 	color: #999;
 	cursor: default;
 	font-size: 17px;
 	font-weight: bold;
 	height: 55px;
 	line-height: 26px;
 	margin-left: -45px;
 	margin-top: 44px;
 	padding: 2px 20px;
 	text-align: left;
 	text-decoration: none;
 	width: 100%;
 	z-index: 0;
 }


/*
** The Meat
*/

.main-body {
	background-image: url("../images/backpack.png");
	background-repeat: no-repeat;
	background-size: 100%;
	height: 1500px;
}

.spinner-container {
	height: 100%;
	width: 10%;
	display: inline-block;
}

.spinner-container > h5 {
	background-image: url("../images/dark-chruch.png");
 	background-size: 100px;
 	box-shadow: 1px 1px 1px 0px #888;
 	color: #999;
 	cursor: default;
 	font-size: 17px;
 	font-weight: bold;
 	height: 55px;
 	line-height: 26px;
 	margin-left: -45px;
 	margin-top: 44px;
 	padding: 2px 20px;
 	text-align: left;
 	text-decoration: none;
 	width: 100%;
 	z-index: 0;
}

.spinner-buffer {
	width: 100%;
}

#bluetooth-buffer {
	height: 8%;
}

#lumbar-buffer {
	height: 71%;
}

#upper-strap-buffer {
	height: 12%;
}

#lower-strap-buffer {
	height: 64%;
}

.glyphicon* {
	color: #CCC;
	position: absolute;
	z-index: 1;
}

.glyphicons {
	color: #CCC;
	text-shadow: 1px 0px .5px #222;
	position: absolute;
	z-index: 1;
}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.spinner {
	background-image: url("../images/spinny.png");
	background-repeat: no-repeat;
	background-size: 100%;
	cursor: pointer;
	position: relative;
	width: 100%;
	z-index: 2;

	-moz-animation:spin 8s linear infinite;
	-webkit-animation:spin 8s linear infinite;
	animation: spin 8s linear infinite;
}


@-webkit-keyframes pulsate {
	0% {-webkit-transform: scale(1.0);}
	50% {-webkit-transform: scale(1.1) rotate(22.5deg);}
	100% {-webkit-transform: scale(1.0) rotate(45deg);}
}
@-moz-keyframes pulsate {
	0% {-moz-transform: scale(1.0);}
	50% {-moz-transform: scale(1.1) rotate(22.5deg);}
	100% {-moz-transform: scale(1.0) rotate(45deg);}
}
@keyframes pulsate {
	0% {-webkit-transform: scale(1.0); transform: scale(1.0)}
	50% {-webkit-transform: scale(1.1) rotate(22.5deg); transform: scale(1.1) rotate(22.5deg);}
	100% {-webkit-transform: scale(1.0) rotate(45deg); transform: scale(1.0) rotate(45deg);}
}
.active-spinner {
	background-image: url("../images/spinny.png");
	background-repeat: no-repeat;
	background-size: 100%;
	width: 100%;

	-webkit-animation: pulsate 1s linear infinite;
	-moz-animation: pulsate 1s linear infinite;
	animation: pulsate 1s linear infinite;
}


/*
** The Footer
*/

.footer {
	background-image: url("../images/dark-chruch.png");
	background-size: 5%;
	box-shadow: 0px -1px 1px 0px #888;
	width: 100%;
}

.footer > h4 {
	display: inline-block;
	margin: 12px 10px;
	color: #CDCDCD;
	font-size: 12px;
	font-weight: bold;
	cursor: default;
}

.footer > a {
	color: #CDCDCD;
	display: inline-block;
	font-size: 12px;
	font-weight: bold;
	margin: 10px;
	text-align: center;
	text-decoration: none;
}