@charset "utf-8";
/* CSS Document */

/* COMBO ORIGINAL NAV BAR STYLE  PLUS NEW DROP DOWN MENU STYLE SHEET */


html,
html * {
		padding: 0;
		margin: 0;
		box-sizing: border-box;
		font-family: Arial, Helvetica, sans-serif;
		}
	
header{
		padding: 32px;
		background-color:#333333;
}

img{
	width:80%;
	max-width:100%;
	height:auto;
	vertical-align:middle;
}
	
video {
    width: 100%;
    height: auto;
}  

body{
		margin-left:auto;
		margin-right:auto;
}


.style-logo {
		margin-left: auto;
		margin-left:auto;
		display: block;	
		width: 100px;
		}

.style-name {
		margin-right: auto;
		margin-right:auto;
		display: block;	
	
		}

.style-urllinks {
		font-size:16px;
		font-weight:600;
		}

/* STYLE FOR PULL DOWN top navigation */

/* Add a background color to the top navigation - Grey 20 */

.topnav {
    background-color:#333;
    overflow: hidden;
}

/* Style the links with no drop down in navigation bar - text is Grey 95 */
.topnav a {
    float: left;
    display: block;
    color:#FFF;
    text-align: left;
    padding: 14px 16px;
    text-decoration: none;
	text-transform:uppercase;
    font-size: 16px;
	font-family:Arial, Helvetica, sans-serif;
}

/* Add an active class to highlight the current page - Purple */
.active {;
    background-color: #636;
    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 buttons that have drop downs to fit inside the topnav */
.dropdown .dropbtn {
    font-size: 16px;
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
	text-transform:uppercase;
    background-color: #333;
    font-family: inherit;
    margin: 0;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
}


/* Style the dropdown content (hidden by default) */
.dropdown-content {
   
	display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Style the links inside the ONE dropdown */
.dropdown-content a {
    float: none;
    color: black;
    padding: 6px 6px;
    text-decoration: none;
    display: block;
    text-align: left;
	text-transform:none;
	font-size: 14px;
}

/* 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;
}


/* DONT KNOW WHAT IS OR IF NECE   Toggle between adding and removing the "responsive" 
class to topnav when the user clicks on the icon */
function myFunction() {
    var x = document.getElementById("myTopnav");
    if (x.className === "topnav") {
        x.className += " responsive";
    } else {
        x.className = "topnav";
    }
} 




/* ORIGINAL NAV BAR STYLE SHEET - USED ON BOTTOM NAV */
.style-nav ul {
		list-style-type: none;
		}
		
.style-nav ul li a {
		
		background-color: #063;
		text-decoration: none;
		color:#FFF;
	 	text-align: center;
		display: block;
		padding: 5px;
		font-size:15px;
		font-weight:600;
		}

a { 
		text-decoration: none; 
		color : #000; 
		}
/* END OF BOTTOM NAV BAR STYLES"  */


.box1 {
		background-color:#FFF;
		background-size: cover;
		padding: 10px 10px 20px 10px;
		color: #636; 
		text-align: left;
		}

.box2 {
		background-image: url("Images/Home and Background/Backgroundaluminum.jpg");
		background-size: cover;
		padding: 10px 10px 20px 10px;
		text-align: center;
		}

/* box style for huge pdf pages centered*/
.box3 {
		background-size: cover;
		padding: 10px 10px 20px 10px;
		text-align: center;
		}


/* white box style for more text and tables*/
.box4 {
		background-size: cover;
		padding: 10px 10px 20px 10px;
		text-align: center;
		}


/* green box style  */
.box5 {
		background-color:#063;
		background-size: cover;
		padding: 10px 0px 10px 0px;
		color: #636; 
		text-align: center;
		}
			


		
h1 {
	font-size: 20px;
	font-transform: uppercase;
	font-weight: 600;
	margin-bottom: 15px;
	color: #FFF;
	text-align: right;
	padding-top: 2px;
	}

h2 {
	text-decoration: none;
	font-size: 17px;
	margin-bottom: 20px;
	color:#FFFFFF;
	text-align: right;
		 
	}

/* PRODUCT TITLE HME PAGE PIX*/
h3 {
	font-size: 17px;
	font-transform: uppercase;
	font-weight:bold;
	margin-top: 10px;
	color:#FFFFFF;
	text-align: center;
	margin-bottom: 20px;
	}

/* CONTENT PAGES PRODUCT TITLE */
h4 {
	font-size: 16px;
	font-transform: uppercase;
	font-weight:600;
	color:#636;
	text-align: center;
	margin-bottom: 10px;
	margin-top: 10px;
	}




/*B&W Table Title Line*/
h5 {
	font-size: 14px;
	font-transform: ;
	font-weight:800;
	text-align: center;
	margin-left: 6px;
	}

/*B&W Table Contents*/
h6 {
	font-size: 13px;
	font-transform: ;
	font-weight:200;
	text-align: left;
	margin-left: 6px;
	}



p {
	font-size: 17px;
	font-weight: 100;
	margin-bottom: 20px;
	text-align:	justify;
	}




.button {
		
	background-color:#333;
	padding: 10px 30px;
	border-radius:10px;
	color:	#FFF;
	text-decoration: none;
	text-align: center;
	}


          


footer{
		padding: 30px 40px;	
		background-color:#333333;
}

.footer-text{
	background color:#333333
	font-size:16px;
	margin-top:20px;
	margin-bottom: 20px;
	color:#FFF;	
	}

.col {
	width:100%;
	}
	

.row:before,.row:after{
		content:"";
		display:table;
		}
		
.row:after{
		clear:both;
		}
		


/*TABLET VIEW*/

@media (min-width: 768px){
		
		body {
				max-width: 778px;
		}
		
		.style-nav ul li {
				display: inline-block;
		} 
				 
		.style-nav ul li {
				text-align: center;
		}
				
		.col-one-half {
				width:50%;
		}
		
		.col {				
				float: left;
				padding:0px 2px 2px;
		}

}


/*DESKTOP VIEW*/

@media (min-width: 1024px){
	
		body{
			max-width: 1500px;
		}
	
		.style-logo {
			float:left;
		}
			
		.style-nav ul li {
			float:center;
		}
		
		.col-one-half {
				width:50%;
		}
		
		.col {				
				float: left;
				padding:0px 2px 2px;
		}

		.col-one-quarter {				
				float: left;
				padding:0px 2px 2px;
				width:25%;
		}

		
}