html, body
{
	height: auto;
	scroll-behavior: smooth;
	padding: 0px;
	margin: 0px;
	width: 100%;
	overflow-x: hidden;
}

body
{
	background: #2C383B;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 11pt;
	font-weight: 300;
	color: #6c6c6c;
}

h1, h2, h3
{
	margin: 0;
	padding: 0;
	font-weight: 600;
	color: #454445;
}

p, ol, ul
{
	margin-top: 0;
}

ol, ul
{
	padding: 0;
	list-style: none;
}

p
{
	line-height: 180%;
}

strong
{
}

a
{
	color: #2C383B;
}

a:hover
{
	text-decoration: none;
}

.container
{
	margin: 0px 0px 0px 30px;
	width: 100%;
	margin-left: 0px;
}

/*********************************************************************************/
/* Image Style                                                                   */
/*********************************************************************************/

	/*.image
{
	display: inline-block;
}

.image img
{
	display: block;
	width: 100%;
}

.image-full
{
	display: block;
	width: 100%;
	margin: 0 0 2em 0;
}

.image-left
{
	float: left;
	margin: 0 2em 2em 0;
}

.image-centered
{
	display: block;
	margin: 0 0 2em 0;
}

.image-centered img
{
	margin: 0 auto;
	width: auto;
} */

/*********************************************************************************/
/* List Styles                                                                   */
/*********************************************************************************/

	ul.style1
{
	margin: 0;
	padding: 0em 0em 0em 0em;
	overflow: hidden;
	list-style: none;
	color: #6c6c6c
}

ul.style1 li
{
	overflow: hidden;
	display: block;
	padding: 2.80em 0em;
	border-top: 1px solid #D1CFCE;
}

ul.style1 li:first-child
{
	padding-top: 0;
	border-top: none;
}

ul.style1 .image-left
{
	margin-bottom: 0;
}

ul.style1 h3
{
	padding: 1.2em 0em 1em 0em;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	font-size: 1.2em;
	font-weight: 600;
	color: #454445;
}

ul.style1 a
{
	text-decoration: none;
	color: #525252;
}

ul.style1 a:hover
{
	text-decoration: underline;
	color: #525252;
}

ul.style2
{
	margin: 0;
	padding-top: 1em;
	list-style: none;
}

ul.style2 li
{
	border-top: solid 1px #E5E5E5;
	padding: 0.80em 0 0.80em 0;
	font-family: 0.80em;
}

ul.style2 li:before
{
	display: inline-block;
	padding: 4px;
	background: #DB3256;
}

ul.style2 a
{
	display: inline-block;
	margin-left: 1em;
}

ul.style2 li:first-child
{
	border-top: 0;
	padding-top: 0;
}

ul.style2 .icon
{
	color: #FFF;
}

ul.style3
{
	margin: 0;
	padding-top: 1em;
	list-style: none;
}

ul.style3 li
{
	border-top: solid 1px rgba(255,255,255,.2);
	padding: 1em 0 1em 0;
	font-family: 0.80em;
}

ul.style3 li:before
{
	display: inline-block;
	padding: 4px;
	background: #FFF;
}

ul.style3 a
{
	display: inline-block;
	margin-left: 1em;
	font-size: 1em !important;
	color: #FFF;
}

ul.style3 li:first-child
{
	border-top: 0;
	padding-top: 0;
}

ul.style3 .icon
{
	color: #DB3256;
}

/*********************************************************************************/
/* Social Icon Styles                                                            */
/*********************************************************************************/

	ul.contact
{
	margin: 0;
	padding: 2em 0em 0em 0em;
	list-style: none;
}

ul.contact li
{
	display: inline-block;
	padding: 0em 0.30em;
	font-size: 1em;
}

ul.contact li span
{
	display: none;
	margin: 0;
	padding: 0;
}

ul.contact li a
{
	color: #FFF;
}

ul.contact li a:before
{
	display: inline-block;
	background: #3f3f3f;
	width: 40px;
	height: 40px;
	line-height: 40px;
	border-radius: 20px;
	text-align: center;
	color: #FFFFFF;
}

ul.contact li a.icon-twitter:before
{
	background: #2DAAE4;
}

ul.contact li a.icon-facebook:before
{
	background: #39599F;
}

ul.contact li a.icon-dribbble:before
{
	background: #C4376B;
}

ul.contact li a.icon-tumblr:before
{
	background: #31516A;
}

ul.contact li a.icon-rss:before
{
	background: #F2600B;
}

/*********************************************************************************/
/* Button Style                                                                  */
/*********************************************************************************/

	.button
{
	display: inline-block;
	padding: 1.3em 3em;
	background: #2C383B;
	-moz-transition: opacity 0.25s ease-in-out;
	-webkit-transition: opacity 0.25s ease-in-out;
	-o-transition: opacity 0.25s ease-in-out;
	-ms-transition: opacity 0.25s ease-in-out;
	transition: opacity 0.25s ease-in-out;
	letter-spacing: 0.20em;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 600;
	color: #FFF;
}

.button:hover
{
}

.button:active
{
}

.button-big
{
	padding: 1.6em 4em;
	font-size: 1.4em;
	font-weight: 900;
}

/*********************************************************************************/
/* Heading Titles                                                                */
/*********************************************************************************/

	.title
{
	margin-bottom: 3em;
}

.title h2
{
	font-weight: 400;
	font-size: 2.8em;
	color: #323232;
}

.title .byline
{
	letter-spacing: 0.15em;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 1.1em;
	color: #6F6F6F;
}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/
	
#header-wrapper
{
	background: #FFF;
	width: 100%;
}

#header
{
	overflow: hidden;
	height: 100px;
}

#header-band {
	background-color: rgb(241, 229, 160);
	padding: 30px;
}

#header-band h3{
	font-size: 24px;
	text-align: center;
	padding-right: 30px;
}

@media only screen and (max-width: 990px) {
	#header-band h3 {font-size: 12px;}
}

#header a {
	float: left;
	line-height: 32px;
}

@media screen and (max-width: 1200px) {
	#header a {
	  float: none; 
	  display: block;
	  text-align: left; 
	}
	.topnav {
	  float: none;
	}
	#header {
		height: 326px;
	}
  } 
/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

#logo
{
	position: absolute;
	top: 2.5em;
	left: 1em;
	width: 100%;
}

#logo h1
{
	color: red;
	display: inline-block;
	font-size: 2.5em;
	text-transform: uppercase;
	font-weight: 700;
	padding-right: 0.50em;
	border-right: 1px solid rgba(0,0,0,.3);
}

#logo span
{
	position: absolute;
	top: 0.5em;
	display: inline-block;
	padding-left: 1.50em;
	padding-bottom: 1em;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	font-size: 1em;
	color: black;
	font-weight: 500;
}

#logo a
{
	font-size: 32px;
	text-decoration: none;
	color: rgb(44, 100, 114);
}

/*********************************************************************************/
/* Nav                                                                          */
/*********************************************************************************/

.topnav {
	background-color: #2C383B;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	padding: 25.5px 0px 11px 0px;
	width: auto;
	padding-left: 20px;
	font-weight: 650;
	padding-right: 10px;
  }


.topnav button {
	font: inherit;
}
  /* Style the links inside the navigation bar */
  .topnav a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 17px;
  }
  
  /* Add an active class to highlight the current page */
  .active {
	background-color: rgb(94, 136, 96);
	color: white;
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
	display: none;
  }
  
  /* Dropdown container - needed to position the dropdown content */
  .dropdown {
	float: left;
	overflow: hidden;
  }
  
  /* Style the dropdown button to fit inside the topnav */
  .dropdown .dropbtn {
	font-size: 17px;
	border: none;
	outline: none;
	color: white;
	padding: 19px 16px 23px;
	background-color: inherit;
	font-family: inherit;
	margin: 0;
  }
  
/* Style the dropdown content (hidden by default) */
  .dropdown-content {
	display: none;
	position: fixed;
	background-color: #555;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
  }
  
  /* Style the links inside the dropdown */
  .dropdown-content a {
	float: none;
	color: white;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
	font-weight: 500;
  }
  
  /* Add a dark background on topnav links and the dropdown button on hover */
  .topnav a:hover, .dropdown:hover .dropbtn {
	background-color: #555;
	color: white;
  }
  
  /* Add a grey background to dropdown links on hover */
  .dropdown-content a:hover {
	background-color: #ddd;
	color: black;
  }
  
  /* Show the dropdown menu when the user moves the mouse over the dropdown button */
  .dropdown:hover .dropdown-content {
	display: block;
  }
  
  

  /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
  /*@media screen and (max-width: 1100px) {
	.topnav a:not(:first-child), .dropdown .dropbtn {
	  display: none;
	}
	.topnav a.icon {
	  float: right;
	  display: block;
	}
  }*/
  
  /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
  /*@media screen and (max-width: 1100px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive a.icon {
	  position: absolute;
	  right: 0;
	  top: 0;
	}
	.topnav.responsive a {
	  float: none;
	  display: block;
	  text-align: left;
	}
	.topnav.responsive .dropdown {float: none;}
	.topnav.responsive .dropdown-content {position: relative;}
	.topnav.responsive .dropdown .dropbtn {
	  display: block;
	  width: 100%;
	  text-align: left;
	}
  }*/

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/
	
	#banner-wrapper
{
	overflow: hidden;
	padding: 0em 1em;
	background: #2C383B;
}

#banner
{
	overflow: hidden;
	width: 100%;
	padding: 0px 0px;
	text-align: center;
	color: rgba(255,255,255,.7);
}

#banner-index
{
	overflow: hidden;
	width: 100%;
	padding: 0px 0px;
	text-align: center;
	color: rgba(255,255,255,.7);
}

#banner a
{
	color: rgba(255,255,255,.9);
}

#banner .box-left
{
	float: left;
}

#banner .box-right
{
	float: right;
}

#banner h2
{
	margin: 0em;
	padding: 0em;
	font-weight: 400;
	font-size: 7em;
	color: #ffffff;
}

#banner span
{
	display: block;
	padding-top: 0.20em;
	text-transform: uppercase;
	font-size: 1.2em;
	color: #A2A2A2;
}

#banner h3 {
	margin: 0em;
	padding: 0.5em;
	font-weight: 400;
	font-size: 2em;
	color: #ffffff;
}

#banner h4 {
	margin: 0 6em 0 6em;
	padding: 1em;
	font-weight: 400;
	font-size: 1.2em;
	color: #d4d4d4;
	line-height: 2;
	text-align: justify;
	line-height: 1.7em;
	padding-bottom: 40px;
}


/*********************************************************************************/
/* Page                                                                          */
/*********************************************************************************/

#wrapper
{
	background: #FFF;
}

#page
{
	overflow: hidden;
	padding: 6em 0em;
	border-bottom: 2px solid #E3E3E3;
	text-align: center;
}

#page .button
{
	margin-top: 2em;
}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

#content
{
	padding: 0em 7em;
}

/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/

	#sidebar
{
	float: right;
	width: 450px;
}

#stwo-col
{
	margin-top: 2em;
}

#stwo-col h2
{
	display: block;
	padding-bottom: 1.5em;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	font-size: 1.2em;
	font-weight: 600;
	color: #454445;
}

#stwo-col .sbox1
{
	float: left;
	width: 210px;
}

#stwo-col .sbox2
{
	float: right;
	width: 210px;
}

/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

#copyright
{
	overflow: hidden;
	padding: 2em 0em;
	border-top: 1px solid rgba(255,255,255,0.08);
}

#copyright-index
{
	overflow: hidden;
	padding: 2em 1em;
	margin: 0 -1em;
	border-top: 1px solid rgba(255,255,255,0.08);
}

#copyright p, #copyright-index p
{
	letter-spacing: 0.20em;
	text-align: center;
	text-transform: uppercase;
	font-size: 0.80em;
	color: rgba(255,255,255,0.3);
}

#copyright a, #copyright a
{
	text-decoration: none;
	color: rgba(255,255,255,0.6);
}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/

#featured-wrapper
{
	padding: 5em 0em;
	background: #FFF;
	text-align: center;
}

#featured
{
	overflow: hidden;
}

#featured .major
{
	overflow: hidden;
	margin-bottom: 3em;
	padding-bottom: 2em;
	border-bottom: 1px solid #E8E8E8;
}

#featured .major h2
{
	font-size: 3em;
}

#featured .major .byline
{
	font-size: 1.3em;
}

#featured .title
{
	margin-bottom: 1.5em;
	padding-bottom: 1.5em;
	border-bottom: 1px solid #E3E3E3;
}

#featured .title h2
{
	font-size: 1.2em;
}

#featured h2
{
	text-align: center;
}

#featured .icon
{
	position: relative;
	display: inline-block;
	width: 150px;
	height: 150px;
	background: #2C383B;
	margin: 0px auto 20px auto;
	line-height:  150px;
	font-size: 5em;
	text-align: center;
	color: #FFF;
}

#featured .fas{
	position: relative;
	display: inline-block;
	width: 150px;
	height: 150px;
	background: #2C383B;
	margin: 0px auto 20px auto;
	line-height:  150px;
	font-size: 5em;
	text-align: center;
	color: #FFF;
}

.flex-container {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	padding: 5px;
}

.column1,  .column2,  .column3, .column4,  .column5
{
	width: 200px;
}

.column1 p,  .column2 p,  .column3 p, .column4 p, .column5 p
{
	color: rgb(44, 100, 114);
}
/*
.column1,  .column2, .column3, .column4
{
	float: left;
	margin-right: 45px;
}

.column5
{
	float: left;
}
*/

	#header-featured
	{
		height: 40em;
		background-image: url(images/cover_image.jpg);
		background-position: top;
		background-size: cover;
	}


#slider-wrapper
{
	padding: 6em 0em;
	background: #DB3256;
}

#slider
{
	margin: 0em auto 0em auto;
	width: 1200px;
	position: relative;
}

#slider .button
{
}

#slider .button:hover
{
}

#slider .viewer
{
	width: 1000px;
	height: 375px;
	margin: 0 auto;
	overflow: hidden;
}

#slider .viewer .reel
{
	display: none;
	height: 375px;
}

#slider .viewer .reel .slide
{
	position: relative;
	width: 1000px;
	height: 375px;
}

#slider .viewer .reel h2
{
	position: absolute;
	top: 130px;
	left: 0;
	width: 1200px;
	height: 80px;
	line-height: 80px;
	background: #111111;
	text-align: center;
	opacity: 0.85;
	font-weight: normal;
	color: #ffffff;
	font-size: 2.25em;
}

#slider .viewer .reel p
{
	position: absolute;
	top: 210px;
	left: 0;
	width: 1200px;
	height: 40px;
	line-height: 40px;
	background: #0074C6;
	text-align: center;
	opacity: 0.85;
	font-weight: normal;
	color: #ffffff;
	font-size: 1.1em;
}

#slider .icon
{
	font-size: 4em;
	color: #FFF;
}

#slider .previous-button
{
	position: absolute;
	top: 150px;
	left: 0;
}

#slider .next-button
{
	position: absolute;
	top: 150px;
	right: 0;
}

#slider .indicator
{
	margin: 30px auto 0 auto;
}

#slider .indicator ul
{
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
}

#slider .indicator ul li
{
	display: inline-block;
	width: 12px;
	height: 12px;
	text-indent: -9999em;
	background: #c8c8c8;
	margin: 0 2px 0 2px;
	border-radius: 8px;
	border-bottom: solid 1px #ffffff;
	border-top: solid 1px #909090;
}

#slider .indicator ul li.active
{
	background: #505050;
	border-top: solid 1px #505050;
}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

#footer-wrapper
{
	overflow: hidden;
	padding: 7em 0em;
	color: rgba(255,255,255,0.5);
}


#footer .title h2
{
	font-size: 2em;
	font-weight: 300;
	color: #FFF;
}

#footer .title .byline
{
	display: block;
	padding-top: 1em;
	text-transform: uppercase;
	font-size: 0.80em;
	color: rgba(255,255,255,0.5);
}

#footer .column1,
#footer .column2
{
	width: 560px;
}

#footer .column1
{
	float: left;
}

#footer .column2
{
	float: right;
}

#footer .button
{
	margin-top: 2em;
}

#about
{
	overflow: hidden;
	margin: 5em auto 2em auto;
	padding: 2em 1em auto 1em;
	background: #ECECEC;
}

#about h2
{
	margin: 1em 0 0 0;
	padding: 0em;
	font-weight: 400;
	font-size: 2.4em;
	color: #555555;
}

#about span
{
	font-weight: 500;
	display: block;
	padding-top: 0.60em;
	padding-right: 2em;
	padding-bottom: 2em;
	padding-left: 2em;
	line-height: 1.5;
	font-size: 1.2em;
	color: rgb(44, 100, 114);
	text-align: justify;
}

@media screen and (max-width: 1200px) {
	#about span {
		font-size: 0.8em;
	}
	h2 {
		font-size: 1.8em;
	}
}


#extra2
{
	margin-top: 5em;
}

#extra2 .button
{
	margin-top: 2em;
}

#extra2 .title h2
{
	font-size: 2em;
}

#extra2 .title .byline
{
	font-size: 0.80em;
}

#extra2 #ebox1,
#extra2 #ebox2
{
	width: 560px;
}

#extra2  #ebox1
{
	float: left;
}

#extra2 #ebox2
{
	float: right;
}

/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
	width: 100%; /* Full width */
	padding: 12px; /* Some padding */ 
	border: 2px solid #ccc; /* Gray border */
	border-radius: 4px; /* Rounded borders */
	box-sizing: border-box; /* Make sure that padding and width stays in place */
	margin-top: 6px; /* Add a top margin */
	margin-bottom: 16px; /* Bottom margin */
	font-family: monospace;
	resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
  }

  input[type=email] textarea {
	width: 100%; /* Full width */
	padding: 12px; /* Some padding */ 
	border: 2px solid #ccc; /* Gray border */
	border-radius: 4px; /* Rounded borders */
	box-sizing: border-box; /* Make sure that padding and width stays in place */
	margin-top: 6px; /* Add a top margin */
	margin-bottom: 16px; /* Bottom margin */
	font-family: monospace;
	resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
  }
  
  /* Style the submit button with a specific background color etc */
  input[type=submit] {
	background-color: rgb(56, 161, 88);
	color: white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
  }
  
  /* When moving the mouse over the submit button, add a darker green color */
  input[type=submit]:hover {
	background-color: #2C383B;
  }
  
  /* Add a background color and some padding around the form */
  .contact-form {
	width: 100%;
	align-items: center;
	border-radius: 5px;
	background-color: #f2f2f2;
	padding: 20px;
  }

  .contact-us {
	  background-color:white;
	  border-radius: 5px;
	  padding-top: 20px;
	  padding-left: 20px;
	  padding-bottom: 20px;
  }
  
  .machine-images {
	  display: inline-block;
	  margin: 0 auto 0 2em;
	  width: 100%;
	  padding: 0;
  }

  /*.col1, .col2, .col3 {
	  margin: 30px;
  } */

  .c1 {
	  padding-right: 200px;
  }

  .c1, .c2 {
	  padding-bottom: 50px;
  }

  /*.cols1, .cols2, .cols3 {
	  padding-right: 100px;
  }

  .cols1, .cols2, .cols3, .cols4 {
	padding-bottom: 50px;
  } */

  .primary-images {
	  display: inline-block;
	  padding-top: 50px;
	  padding-left: 200px;
	  width: 1200px;
  }

  .secondary-images {
	display: inline-block;
	padding-top: 50px;
	padding-left: 225px;
	width: 1200px;
}

  .tertiary-images {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	align-content: space-between;
	flex-wrap: wrap;
	margin: 0em auto 0em 8em;
}

	.cols1, .cols2, .cols3, .cols4 {
		margin: 30px;
	}
  
/*random*/

.image-list-small {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0 auto;
	text-align: center;
	max-width: 800px;
	padding: 0;
  }
  
  .image-list-small li {
	display: inline-block;
	width: 181px;
	margin: 0 90px 15px;
  }
  
  
  /* Photo */
  
  .image-list-small li > a {
	display: block;
	text-decoration: none;
	background-size: cover;
  	background-repeat: no-repeat;
	height: 250px;
	margin: 0;
	padding: 0;
	border: 4px solid #ffffff;
	outline: 1px solid #d0d0d0;
	box-shadow: 0 2px 1px #DDD;
  }
  
  .image-list-small .details {
	margin-top: 13px;
  }
  
  
  /* Title */
  
  .image-list-small .details h3 {
	display: block;
	font-size: 11px;
	margin: 0 0 3px 0;
	white-space: nowrap;
	overflow: hidden;
	width: 180px;
	height: 100px;
	color: white;
  }
  


  .image-list-small .details h3 a {
	color: white;
	text-decoration: none;
  }