::-webkit-scrollbar { 
    display: none; 
}

/*--------------------------------
Body Styles
--------------------------------*/

html, body {
	width:100%;
	height:100%;
	margin:0%;
	padding:0%;
	position:relative;
	font-family:sans-serif;
	font-weight:lighter;
}

footer {
	width:100%;
	height:auto;
	background-color:#273985;
	text-align:center;
	color:#fff;
}

footer > p {
	padding-top:5vh;
	padding-bottom:5vh;
	margin-top:0%;
	margin-bottom:0%;
}

/*--------------------------------
General Website Styles
--------------------------------*/

/*This is the head image and body 
images that break the page into secions*/

.body-head, .body-image {
	width:100%;
	height:40vh;
	text-align:center;
	color:#fff;
	position:relative;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	background-attachment:fixed;
	box-shadow:inset 0 0 0 800px rgba(0,0,0,0.4);
}

/*This is the body section sizing. It will respond
to the size of the page*/

.body-text {
	padding-top:5vh;
	padding-bottom:5vh;
	text-align:center;
}

/*This is the body section sizing paragraph*/

.body-text > p {
	width:60%;
	margin:auto;
	padding-top:2vh;
	padding-bottom:2vh;
	font-weight:normal;
	line-height:30px;
	text-align:left;
}

.titlesP {
	width:60%;
	font-weight:lighter;
	padding-bottom:10px;
	border-bottom:1px solid #000;
	margin:auto;
	margin-bottom:0.1em;
	text-align:left;
}

.header-title {
	text-transform:uppercase;
	font-size:30pt;
	margin-top:0%;
	position:absolute;
	top:2.5em;
	position:relative;
}

.title-cards {
	text-transform:uppercase;
	font-size:30pt;
	margin-top:0%;
	position:absolute;
	top:3em;
	position:relative;
}

/*--------------------------------
Navigation Computer Styles
--------------------------------*/

.nav-head {
	width:100%;
	height:3em;
	position:absolute;
	z-index:100000000;
	top:0em;
	position:relative;
}

.logoArea {
	position:absolute;
	width:9em;
	height:6em;
	left:3em;
	top:1.5em;
}

.logo {
	width:5em;
	height:5em;
	background-image:url("../images/logo.png");
	background-repeat:no-repeat;
	background-size:75%;
	background-position:center center;
}

.name {
	float:left;
	text-align:left;
	position:absolute;
	top:0.8em;
	left:5em;
	color:#fff;
}

.nav-ul {
	position:absolute;
	z-index:100000; 
	top:3em;
	right:1em;
	padding-left:0px;
	margin-top:0px;
}

.nav-li {
	display:inline-block;
	text-align:center;
	padding:15px;
	position:relative;
}

.nav-li > a {
	text-decoration:none;
	text-transform:uppercase;
	color:#fff;
	text-align:center;
}

.nav-li > a:after {
	content:"";
	height:3px;
	display:block;
	width:0%;
	background-color:#fff;
	margin:auto;
	transition:all 0.5s ease;
}

.nav-li > a:hover:after {
    display:none;
	width:100%;
}

.subMenu {
	position:absolute;
	z-index:100;
	top:2.5em;
	left:-2px;
	box-shadow:inset 0 0 0 800px rgba(0,0,0,0.0);
	padding:5px;
	height:0px;
	overflow:hidden;
	transition:all 0.5s ease;
}

.sub-ul {
	padding-left:0px;
	margin-top:0px;
}

.sub-li {
	list-style-type:none;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
}

.sub-li > a {
	text-decoration:none;
	text-transform:uppercase;
	color:#fff;
}

.sub-li > a:after {
	content:"";
	height:2px;
	display:block;
	width:0%;
	background-color:#fff;
	margin:auto;
	transition:all 0.5s ease;
}

/*--------------------------------
Home Computer Styles
--------------------------------*/
#home-head {
	background-image:url("../images/coffee_large.jpg");
}

#testimonials {
	width:100%;
	height:auto;
	padding-top:1vh;
	padding-bottom:3vh;
	position:relative;
}

#testimonials > h2 {
	width:40%;
	text-align:center;
	padding:15px;
	text-transform:uppercase;
	margin:auto;
	margin-bottom:1em;
	border:1px solid #000;
}

#slider {
	width:90vw;
	height:25em;
	position:absolute;
	left:5vw;
	overflow:hidden;
	position:relative;
	box-shadow:0 0 18px #000;
}

#videoContainer {
	width:270vw;
	height:100%;
	position:absolute;
	top:0px;
	left:0px;
	transition:all 0.5s ease;
}

.videos {
	width:90vw;
	height:100%;
	float:left;
	box-shadow:inset 0 0 0 800px rgba(39, 57, 133, 0.4);
}

.button-section {
	height:10em;
	width:90vw;
	text-align:center;
	position:absolute;
	top:11em;
	transition:all 0.5s ease;
}

.button {
	padding:15px;
	border:1px solid #fff;
	background-color:#fff;
	color:#273985;
	border-radius:25px;
	width:10em;
	display:inline-block;
	text-align:center;
	text-transform:uppercase;
	cursor:default;	
	transition:all 0.5s ease;
}

#moveVid {
	position:absolute;
	top:1em;
	left:1em;
}

.vidOpt {
	height:2em;
	width:2em;
	border-radius:50%;
	background-color:#fff;
	display:inline-block;
}

/*--------------------------------
About Computer Styles
--------------------------------*/
#about-head, #about-image {
	background-image:url("../images/mountain_large.jpg");
}

/*--------------------------------
Training and Opportunities Computer Styles
--------------------------------*/
.quotes {
	margin-top:0px;
	line-height:15px;
}

#top-head, #top-images {
	background-image:url("../images/comp_large.jpg");
}

#top-first {
	top:2.3em;
}

/*--------------------------------
Employer Computer Styles
--------------------------------*/
#employer-head {
	background-image:url("../images/laptop_large.jpg");
}

/*--------------------------------
Services Computer Styles
--------------------------------*/
#services-head {
	background-image:url("../images/talking_large.jpg");
}

#services-text {
	height:39vh;
}

.ser-buttons {
	margin-top:2em;
	width:15em;
	border:1px solid #000;
	border-radius:25px;
	padding:15px;
	color:#000;
	text-transform:uppercase;
	display:inline-block;
}

/*--------------------------------
Resources Computer Styles
--------------------------------*/
#resources-head {
	background-image:url("../images/lake_large.jpg");
}

.links {
	text-align:center;
}

.links > a {
	text-decoration:none;
	color:#273985;
	margin-bottom:0.5em;
}


/*--------------------------------
Contact Computer Styles
--------------------------------*/
#contact-head {
	background-image:url("../images/contact_large2.jpg");
}

#contact-page {
	height:50vh;
}

#contact-page > p {
	text-align:center;
}

#contact {
	list-style-type:none;
	text-align:left;
	width:50%;
	margin:auto;
}

#contact > li {
	margin-bottom:0.5em;
}

#linkdinAccount {
	padding:15px;
	border:1px solid #273985;
	border-radius:25px;
	width:60%;
	text-align:center;
	color:#273985;
}

#linkdinAccount:hover {
	background-color:#273985;
	color:#fff;
}

/*--------------------------------
Stories Computer Styles
--------------------------------*/
#story-head {
	background-image:url("../images/lake_large.jpg");
}

#story-videos {
	width:100%;
	position:relative;
	min-height:220vh;
	padding-bottom:5vh;
}

#first-story-vid,
#second-story-vid,
#third-story-vid {
	height:25em;
	margin-left:5vw;
	margin-top:0.8em;
	margin-bottom:0.5em;
	box-shadow:0 0 18px #000;
}

/*--------------------------------
Employment Computer Styles
--------------------------------*/
#employment-head, #employ-image {
	background-image:url("../images/bridge_large.jpg");
}

/*--------------------------------
Supported Living Computer Styles
--------------------------------*/
#supported-head {
	background-image:url("../images/coffee_large.jpg");
}

/*--------------------------------
Disability Computer Styles
--------------------------------*/
#disability-head, #dis-images {
	background-image:url("../images/hands_large.jpg");
}

@media only screen and (max-width:1000px) {

	/*--------------------------------
	Navigation Computer Styles
	--------------------------------*/
	.hamburger {
		position:absolute;
		width:3em;
		height:3em;
		top:2.5em;
		right:1em;
		z-index:1000000;
		position:fixed;
		background-repeat:no-repeat;
		background-size:cover;
		background-position:center center;
		background-image:url("../images/hamburger.png");
	}

	.nav-ul {
		top:0px;
		right:-100vw;
		width:40vw;
		height:100vh;
		padding-top:7em;
		background-color:#273985;
		position:fixed;
		transition:all 0.5s ease;
	}

	.nav-li {
		display:block;
	}

	.subMenu {
		display:none;
	}

	/*--------------------------------
	General Website Styles
	--------------------------------*/

	/*This is the body section sizing. It will respond
	to the size of the page*/

	.body-text {
		padding-top:5vh;
		padding-bottom:5vh;
	}

	/*This is the body section sizing paragraph*/

	.body-text > p {
		width:80%;
		margin:auto;
		padding-top:2vh;
		padding-bottom:2vh;
		font-weight:normal;
		line-height:30px;
	}

	.titlesP {
		width:80%;
		font-weight:lighter;
		padding-bottom:10px;
		border-bottom:1px solid #000;
		margin:auto;
		margin-bottom:0.1em;
	}

	.header-title {
		text-transform:uppercase;
		font-size:30pt;
		margin-top:0%;
		position:absolute;
		top:2.5em;
		position:relative;
	}

	.title-cards {
		text-transform:uppercase;
		font-size:30pt;
		margin-top:0%;
		position:absolute;
		top:3em;
		position:relative;
	}

	/*--------------------------------
	Home Computer Styles
	--------------------------------*/

	#testimonials {
		height:165vh;
	}

	#slider {
		height:160vh;
		box-shadow:0 0 0 0 transparent;
	}

	#videoContainer {
		width:90vw;
		height:100%;
	}

	.videos {
		margin-bottom:2em;
		position:relative;
		box-shadow:0 0 14px rgba(0,0,0,0.4);
	}

	#first {
		width:90vw;
		height:45vh;
	}

	#first > .button-section {
		height:10em;
		width:90vw;
		top:0.5em;
	}

	.button {
		margin-bottom:6px;
		margin-left:75%;
		padding:0px;
		width:3em;
		height:3em;
		overflow:hidden;
		color:transparent;
		background-repeat:no-repeat;
		background-size:80%;
		background-position:30% center;
		background-image:url("../images/books.png");
	}

	#second {
		width:90vw;
		height:45vh;
		overflow:hidden;
		width:;
	}

	#second > .button-section {
		height:10em;
		width:90vw;
		top:0.5em;
	}

	#third {
		height:45vh;
		position:relative;
	}

	#third > .button-section {
		height:10em;
		width:90vw;
		top:0.5em;
	}

	#moveVid {
		display:none;
	}

	.first-button-watch {
		display:none;
	}

	/*--------------------------------
	Services Tablet Styles
	--------------------------------*/

	#services-text {
		height:60vh;
	}

	/*--------------------------------
	Resources Tablet Styles
	--------------------------------*/

	.links {
		width:80%;
		margin:auto;
		text-align:left;
	}

}

@media only screen and (max-width:450px) {

	/*--------------------------------
	Navigation Phone Styles
	--------------------------------*/
	.logoArea {
		left:0.5em;
	}

	.name {
		display:none;
	}

	.nav-ul {
		width:100%;
		height:100vh;
		right:-100vw;
		padding-top:7em;
		background-color:#273985;
	}

	.nav-li {
		display:block;
	}

	.subMenu {
		display:none;
	}

	/*--------------------------------
	General Website Styles
	--------------------------------*/

	/*This is the body section sizing. It will respond
	to the size of the page*/

	.body-text {
		padding-top:3vh;
		padding-bottom:3vh;
	}

	/*This is the body section sizing paragraph*/

	.body-text > p {
		margin-bottom:1em;
	}

	.header-title {
		text-transform:uppercase;
		font-size:30pt;
		margin-top:0%;
		position:absolute;
		top:1em;
		position:relative;
	}

	.title-cards {
		text-transform:uppercase;
		font-size:30pt;
		margin-top:0%;
		position:absolute;
		top:1.5em;
		position:relative;
	}
    
    .body-text > ul {
        /*list-style-position: outside;
        list-style-type:disc;
        border: 1px solid black;
        border-radius: 3px 3px 3px 3px;
        margin-left: 20em;
        background: yellow;
        position:relative;*/
        text-align: left;
        padding-left: 20em;
    }
    
    .body-text > ul > li {
        text-align: left;
        font-size: 16px;
        display:inline-block;
    }

	/*--------------------------------
	Home PHone Styles
	--------------------------------*/

	#testimonials {
		height:155vh;
	}

	#testimonials > h2 {
		width:100%;
		padding-top:15px;
		padding-bottom:15px;
		padding-left:0px;
		padding-right:0px;
		border-top:1px solid #000;
		border-bottom:1px solid #000;
		border-right:0px;
		border-left:0px;
	}

	#slider {
		width:100%;
		height:135vh;
		left:0px;
		padding-top:5vh;
		padding-bottom:5vh;
		position:absolute;
		overflow:auto;
		box-shadow:inset 0 0 0 transparent;
	}

	#videoContainer {
		width:100%;
		height:auto;
		position:absolute;
		top:0px;
		left:0px;
	}

	.videos {
		width:90vw;
		height:45vh;
		margin-left:5vw;
		margin-bottom:1em;
		clear:left;
		box-shadow:0 0 16px #000;
	}

	#first, 
	#second,
	#third {
		width:90vw;
		height:45vh;
	}

	#first >  .button-section,
	#second >  .button-section,
	#third >  .button-section {
		height:10em;
		width:90vw;
		top:0.5em;
	}

	.button {
		margin-bottom:6px;	
		margin-left:17em;
	}

	.second-button-watch {
		left:0px;
		top:0px;
	}

	/*--------------------------------
	Services Phone Styles
	--------------------------------*/

	#services-text {
		height:80vh;
	}
    

}

