@charset "UTF-8";

* {
    box-sizing: border-box;
}

/*---------------- SIDE STICKY NAV WITH DOTS------------------
.SideNav {
	position: fixed;
	bottom: 150px;
	right: 0px;
	width: 50px;
	padding: 6px;
	text-align: center;
	background-color: rgba(0,0,0,0.47);
	z-index: 6099;
}
*/


.material-icons {
	margin: 6px;
}
.material-icons a {
	color: #fff;
	text-decoration: none;
	font-size: 19px;
}
.material-icons a:hover {
	color: #fddc00;
	text-decoration: none;
}


/*------------------- WORK ARROWS ---------------------*/
.BigPics-DownArrow {
	Position: absolute;
	bottom: 8%;
	left: 46%;
}

@media (max-width: 500px) {
.BigPics-DownArrow {
	display: none;
}
}
.BigPics-UpArrow {
	Position: absolute;
	top: 0;
	left: 46%;
}
@media (max-width: 500px) {
.BigPics-UpArrow {
	Position: absolute;
	top: 0;
	left: 40%;
}
}
.BigPics-UpArrow .material-icons a {
	color: #333;
}
.BigPics-UpArrow .material-icons a:hover {
	color: #999;
}
.arrowsBigger a {
	font-size: 3em;	
	color: #fff;
}

.arrowsBigger a:hover {
	font-size: 3em;	
	color: #fddc00;
}


hr {
	display: block;
	margin-top: 90px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	border-width: 2px;
	border-color: #000;
}

/*---------------- TEXT PAGES FLEXBOX CENTERED 1 COLUMN-----------------*/

.text-intro-centered {
	margin-top: 110px;
	width: 100%;
	max-width: 1200px;
	padding: 3%;
	font-size: 17px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	min-height: 600px;
}
.text-intro-centered h2 {
	font-size: 25PX;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	margin-bottom: 5px;
}

/*---------------- TEXT PAGES FLEXBOX TWO COLUMN PAGES-----------------*/
.text-intro {
	margin-top: 110px;
	margin-bottom: 50px;
	width: 100%;
	max-width: 1000px;
	padding: 3%;
	font-size: 33px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.text-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 10px;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.text-Left {
	width: 34%;
	margin: 1%;
}
.text-Right {
	width: 55%;
	margin: 1%;
	line-height: 30px;
	font-size: 17px;
}

@media (max-width: 500px) {
	
.text-container {
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}
.text-Left {
	width: 100%;
	padding-left: 70px;
	padding-right: 70px;
	padding-bottom: 0;
	text-align: center;
}
.text-Left img {
	display: block;
	margin-left: auto;
	margin-right: auto;}
.text-Right {
	width: 100%;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 0;
	line-height: 20px;
	font-size: 16px;
	margin-top: 0px;
	margin-bottom: 20px;
}
}


/*---------------- LOGO------------------*/

.Intro-Container {
	background-color: #eee;
	width: 100%;
	height: 1900px;
	padding-top: 100px;
	padding-bottom: 40px;
	position: fixed;
	top: 0px;
	z-index: 1;
}
.Intro {
	display: flex;
	flex-wrap: wrap;
	max-width: 1200px;
	left: calc(-50vw + 50%); /*---- CENTERS FIXED DI------*/
	right: calc(-50vw + 50%);/*---- CENTERS FIXED DI------*/
	margin-left: auto;/*---- CENTERS FIXED DI------*/
	margin-right: auto;/*---- CENTERS FIXED DI------*/
}
.Intro-left {
	padding-left: 3%;
	width: 50%;
}
.Intro-Right {
	width: 50%;
	padding-right: 3%;
	padding-top: 60px;
	line-height: 30px;
	font-size: 17px;
}

@media (max-width: 500px) {
.Intro-Container {
	background-color: #eee;
	width: 100%;
	height: 650px;
	padding-top: 0;
	padding-bottom: 40px;
	position: relative;
	top: 0px;
	z-index: 1;
}
.Intro-left {
	padding-left: 15%;
	width: 85%;
}
.Intro-Right {
	width: 99%;
	padding-right: 6%;
	padding-top: 0;
	padding-left: 6%;
	line-height: 20px;
	font-size: 16px;
	margin-top: -30px;
}
}

/*----- CONTAINS ALL LOWER WORK PAGE STUFF THAT SCROLLS UP ----*/
.Container {
	background-color: rgba(255,255,255,0.95);
	position: relative;
	z-index: 10;
	border-top: 1px solid #D4D4D4;
}

@media (max-width: 500px) {
.Container {
	background-color: rgba(255,255,255,0.95);
	position: relative;
	z-index: 10;
	border-top: 1px solid #D4D4D4;
	margin-top: -250px;
}
}

/*-------------- THUMBNAILS -----------*/
.Thumbs {
  	display: flex;
  	flex-wrap: wrap;
	justify-content: center;
	padding-top: 90px;
	padding-bottom: 90px;
}
.Thumbs > div {
	padding: 10px;
	width: 31%;
}

/*-------------- VIDEO GREY BACKROUND -----------*/
.Grey {
  	position: fixed;
	width: 100%;
	top: 200px;
	height: 1200px;
	z-index: -1;
	background-color: #E6E6E6;
}


/*-------------- CAREERS SECTION STUFF -----------------*/

.text-container-careers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 10px;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.text-item-careers {
	width: 44%;
	margin: 1%;
	background-color: #999;
	color: #fff;
	padding: 30px;
	text-align: center;
}
.text-item-jobs {
	width: 44%;
	margin: 1%;
	background-color: #FF9100;
	color: #fff;
	padding: 30px;
	text-align: center;	
}
.text-item-jobs a:link {
    color: #FFFFFF;
}
.text-item-jobs a:hover {
    color: #333333;
}
.text-item-jobs a:visited {
    color: #ffffff;
}


.text-intro-careers {
	margin-top: 110px;
	margin-bottom: 0px;
	width: 100%;
	max-width: 1000px;
	padding: 3%;
	font-size: 33px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.form3col-container {	
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 10px;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.form3col-item {
	width: 31%;
	margin: 1%;
	line-height: 30px;
	font-size: 17px;
}

.form3col-container .form3col-item input {
	width: 100%;
	height: 40px;
	margin-bottom: 12px;
}
.form3col-container .form3col-item textarea {
	width: 100%;
	height: 120px;
}
.form3col-container .form3col-item select {
	width: 100%;
	height: 30px;
	margin-bottom: 12px;
}


.hello {
	width: 100%;
	font-size: 14px; 
	padding-right: 1.5%;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
	text-align: right;
}



.formSingle {
	width: 100%;
	padding-left: 1.5%;
	padding-right: 1.5%;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}
.formSingle input {
	width: 180px;
}

.formSingle input[type=checkbox] {
	width: 20px;
}

.formSingle input[type=button] {
	background-color: #FF9100;
	width: 140px;
	padding-top: 7px;
	padding-bottom: 7px;
	border: 0;
	color: #FFFFFF;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
}

.formSingle input[type=submit] {
	background-color: #FF9100;
	width: 290px;
	padding-top: 7px;
	padding-bottom: 7px;
	border: 0;
	color: #FFFFFF;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
}



/*-------------- FORM STUFF -----------------*/
.form4col-container {	
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 10px;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.form4col-item {
	width: 23%;
	margin: 1%;
	line-height: 30px;
	font-size: 17px;
}

.login input {
	width: 200px;
	height: 40px;
	margin-bottom: 12px;
}

.errorMssg {
    color: #FF0004;
}