body {
font-size:100%;
font-family: 'Droid Sans', Arial, sans-serif;
background-color:#212121;
}




/*--- small css reset -----*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, textarea, caption, tbody, tfoot, thead, tr, th, td, p {
margin: 0;
padding: 0;
border: 0;
} 

/*------------ headline reset ---------------------*/

h1, h2, h3, h4, h5{  
font-size: 1em;
margin:0px;
padding:0px; 
font-weight:normal;
}
 
/*--- basic setup -----*/


a {outline: none;text-decoration:none;}
a:hover{text-decoration:none;}
img, a {border-style : none; border-width : 0px; }
img, area {border: 0px;}

.clear {clear:both;}
.right {float:right;display:inline;}
.left {float:left;display:inline;}
.center{text-align:center;}
.relative{position:relative;}
.auto {margin:auto;}
.hide{display:none;}
.block {display:block;}

#skip-link{display:none;}

textarea {overflow: auto;}/*- removes scrollbar in IE -*/
*:focus { outline: none;} /*- remove chrome yellow line -*/
body > iframe, #_atssh {display: none!important;} /*- fixes Add This bug -*/

tt, code, kbd, samp, textarea {font-family: arial, sans-serif; }
p:empty {display:none;} /*- in case cms puts in any blank p tags -*/

.screen-reader-text {display:none;}

  .hide {
  display: none !important;
}

/*------- responsive colums ---------*/


/*  SECTIONS  */
.colsection {
	clear: both;
	padding:0 2.5% 0 2.5%;
	margin: 0px;}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 0 0 0 1.6%;
}
.col-nm{
display: block;
	float:left;
}

.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}

/*  GRID OF TWO   ============================================================================= */

.span_1_of_1 {width: 100%;}

.span_1_of_2 {width: 49.2%;}

.span_1_of_2_50 {width: 50%;overflow:hidden;}

/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */

@media only screen and (max-width: 640px) {
	.span_1_of_2,
	.span_1_of_2_50
	 {width: 100%; }
	 .group {margin-bottom:20px;}
}

/*  GRID OF THREE  */
.span_3_of_3 {width: 100%;}
.span_2_of_3 {width: 66.1%;}
.span_1_of_3 {width: 32.2%;}
/*  GRID OF FOUR   ============================================================================= */

	
.span_4_of_4 {width: 100%;} 

.span_3_of_4 {width: 74.6%; }

.span_2_of_4 {width: 49.2%; }

.span_1_of_4 {width: 23.8%; }


/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */

@media only screen and (max-width: 640px) {
	.span_4_of_4 {width: 100%; }
	.span_3_of_4 {width: 100%; }
	.span_2_of_4 {width: 100%; }
	.span_1_of_4 {width: 100%; }
}

/*  GRID OF TWELVE   ============================================================================= */

.span_12_of_12 {width: 100%;}
.span_11_of_12 {width: 91.53%;}
.span_10_of_12 {width: 83.06%;}
.span_9_of_12 {width: 74.6%;}
.span_8_of_12 {width: 66.13%;}
.span_7_of_12 {width: 57.66%; }
.span_6_of_12 {width: 49.2%; }
.span_5_of_12 {width: 40.73%; }
.span_4_of_12 {width: 32.26%; }
.span_3_of_12 {width: 23.8%;}
.span_2_of_12 {width: 15.33%; }
.span_1_of_12 {width: 6.86%; }


/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */

@media only screen and (max-width: 640px) {
	.span_12_of_12,
	.span_11_of_12,
	.span_10_of_12,
	.span_9_of_12,
	.span_8_of_12,
	.span_7_of_12,
	.span_6_of_12,
	.span_5_of_12,
	.span_4_of_12,
	.span_3_of_12,
	.span_2_of_12,
	.span_1_of_12 {width: 100%;}
}

/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */

@media only screen and (max-width: 640px) {
	.col { margin: 1% 0 1% 0%;}
}

@media only screen and (max-width: 640px) {
	.span_3_of_3 {width: 100%; }
	.span_2_of_3 {width: 100%; }
	.span_1_of_3 {width: 100%;}
}

/*---------- common layout -------------*/


._inner {width:100%;float:left;display:inline;}
.holder{margin:auto;padding:0px;clear:both;}

._width {width:100%;max-width:1000px;}


p {line-height:1.4em;}
.content p a {color:#4c4c4c;text-decoration:underline;}
.content p a:hover {text-decoration:underline;}

.home .content p a  {color:#ffffff;}

/*--- mobile / desktop -------*/

.desktop {}
.mobile {display:none;}



@media only screen and (max-width: 640px) {
.desktop {display:none!important;}
.mobile {display:inline;}
}

/* -------------- header -------------------*/

.header {float:left;display:inline;width:100%;position:relative;padding-bottom:25px;color:#ffffff;
/*background:#383838;*/}

.header .logo {float:left;display:inline;margin-top:15px;margin-left:10px}
.header .logo img {display:block;width:100%;max-width:259px;height:auto;}


.header .address {float:right;display:inline;text-align:right;
margin-top:40px;
margin-right:35px;}

.header .address .addr {font-size:0.8125em;line-height:1.4em;margin-bottom:10px;}
.header .address .tel {font-size:0.875em;line-height:1.4em;}
.main-nav .tel {font-size:0.875em;}
.main-nav .tel img {margin-right:5px;vertical-align:top;}
.main-nav .tel a,
.header .tel a {text-decoration:none!important;color:#ffffff!important;}

.visit {font-size:0.75em;float:right;display:inline;}
.visit a {color:#ffffff;text-decoration:none;}

@media screen and (max-width: 1000px) {
._inner {width:95%;padding-left:2.5%;padding-right:2.5%;}
}

@media screen and (max-width: 480px) {
.header {margin-bottom:10px;}
.header .logo {width:100%;text-align:center;margin-bottom:20px;margin-left:0;}
.header .logo img {display:inline;width:80%;max-width:none;}
.header .address,
.visit {clear:both;float:left;width:100%;text-align:center;margin-top:0}


}


/* -------------- main nav -------------------*/

.main-nav {clear:both;float:left;display:inline;width:100%;background:#4a4a4a;padding-top:10px;padding-bottom:10px;margin-bottom:10px;}

.main-nav .nav {list-style:none;float:left;display:inline;margin-left:35px;}
.main-nav .nav li {float:left;display:inline;}
.main-nav .nav li a {display:block;color:#ffffff;font-size:0.875em;margin-right:35px;text-align:center;}

.home .main-nav .nav li ._home,
.history .main-nav .nav li ._history,
.process .main-nav .nav li ._process,
.technical .main-nav .nav li ._technical,
.industry .main-nav .nav li ._industry,
.contact .main-nav .nav li ._contact {color:#c4f5ff;}


.main-nav .tel {float:right;display:inline;color:#ffffff;margin-right:35px;}

/* temp resposnive change */

@media screen and (max-width: 480px) {
.main-nav .nav li {clear:both;padding-bottom:5px;}
.main-nav .nav li br {display:none;}
}


/* -------- content --------*/

.content .banner {
float:left;display:inline;position:relative;
width:100%;
height:338px;
background: url(images/banner-1.jpg) top center no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
margin-bottom:10px;
}

.content .banner .overlay {position:absolute;right:20px;bottom:20px;width:200px;padding:10px;
background: url(images/overlay.png);
font-size:0.9375em;color:#ffffff;
-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}
	
	.content .banner .overlay p {line-height:1.3em;}

@media screen and (max-width: 1000px) {
.content .banner {height:auto;padding-bottom:30%;}
}	

@media screen and (max-width: 480px) {
.content .banner {padding-bottom:40%;min-height:0;}
.content .banner .overlay {width:100%;right:0;bottom:0;}
}


.img {display:block;width:100%;height:auto;}

.home-row-1 {float:left;display:inline;
background:#353535;
margin-bottom:10px;
}


@media screen and (max-width: 640px) {
.home-row-2 img {width:100%;}
}



.home-row-2 {float:left;display:inline;
background:#353535;
margin-bottom:10px;
}

@media screen and (max-width: 640px) {
.home-row-2 .col {margin:0!important;}
}



.home-row-1 p {display:block;color:#ffffff;font-size:0.93em;padding-left:35px;padding-right:35px;padding-top:20px;padding-bottom:20px;}
.home-row-2 p {display:block;color:#ffffff;font-size:0.875em;padding-left:35px;padding-right:35px;padding-bottom:1em;}

.home-row-2 p:first-child {padding-top:5%;}


.caption {background: url(images/overlay.png);
color:#ffffff;
max-width:50%;
padding:8px;
font-size:0.75em;
line-height:1.4em;
position:absolute;bottom:0;left:0;}



@media screen and (max-width: 640px) {
.caption {width:100%;max-width:none;
-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
}

.caption:empty {display:none;}


.home-row-3 {float:left;display:inline;background: #040301 url(images/smelt-background.jpg) top center no-repeat;margin-bottom:10px;}

.home-row-3 p {padding:0 20px 1em 20px;font-size:0.875em;}

.home-row-3 .smelt {color:#ffffff;float:right;padding-left:42%;padding-top:40px;padding-bottom:60px;}

@media screen and (max-width: 640px) {
.home-row-3 .smelt  {padding-left:30%;}
}

/*------ history -----------*/

.pouring {background: #000000 url(images/pouring-background.jpg) center bottom no-repeat;}

.history-copy {padding:35px;color:#ffffff;width:40%;padding-bottom:100px;margin-bottom:10px;}
.history-copy h1 {font-size:1.875em;padding-bottom:0.5em;}

.history-copy p {font-size:0.875em;padding-bottom:1em;}

@media screen and (max-width: 640px) {
.pouring {background-position: -500px 300px ;}
.history-copy {width:95%;padding-bottom:300px;padding-left:2.5%;padding-right:2.5%;}
}

/*--------- process -----------*/

.content-grey {float:left;display:inline;width:100%;background:#e9e9e9;color:#313131;padding:35px;
-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.content-grey h1 {font-size:1.875em;padding-bottom:0.5em;}
.content-grey h2 {font-size:1.25em;padding-bottom:0.5em;}
.content-grey h3 {font-size:0.9375em;padding-bottom:0.2em;font-weight:bold;color:#434343;}

.content-grey p,
.content-grey ul,
.content-grey ol {font-size:0.875em;padding-bottom:1em;}

.content-grey ul,
.content-grey ol {padding-left:1em;margin-left:1em;}

.wideimg {margin-bottom:20px;}


.dark-overlay {display:inline-block;background:url(images/darker-overlay.png);color:#ffffff;padding:20px 30px 20px 30px;}
.two-men {background:url(images/working-larger.jpg) bottom right no-repeat;margin-bottom:20px;}

@media screen and (max-width: 640px) {
.two-men .col {margin:0!important;}
}

/*--- contact ---*/
.contact-address {padding:40px;color:#ffffff;}
.contact-address h1 {font-size:1.875em;padding-bottom:0.5em;}
.contact-address p {font-size:0.875em;padding-bottom:1em;}
.contact-address p a {color:#ffffff;text-decoration:underline;}



/*------------- FOOTER ----------------*/

.footer {clear:both;float:left;display:inline;width:100%;text-align:center;padding-top:30px;padding-bottom:30px;}

.footer .nav {display:inline-block;list-style:none;margin-bottom:20px;}
.footer .nav li {float:left;display:inline;}
.footer .nav li a {display:block;margin-right:30px;padding-right:30px;color:#ffffff;font-size:0.75em;border-right:1px solid #ffffff;}

.footer .group {display:inline-block;list-style:none;margin-bottom:30px;}
.footer .group li {float:left;display:inline;margin-right:20px;margin-left:20px;}
.footer .group li a {display:block;}

.footer .nav li:last-child a {margin-right:0;padding-right:0;border-right:none;}

.footer .address {color:#878787;font-size:0.75em;line-height:1.5em;}

@media screen and (max-width: 640px) {
.footer .nav,
.footer .group {text-align:center;}
.footer .nav li,
.footer .group li {display:block;clear:both;width:100%;text-align:center;margin:0}
.footer .nav li a {display:block;border:none;padding:0;margin:0;}
}

.partof {color:#ffffff;font-size:0.75em;padding-bottom:10px;margin-top:10px;}

.footer-links {clear:both;float:left;display:inline;width:100%;text-align:center;}

.footer-links p {display:inline-block;width:60%;line-height:1em;margin-bottom:30px;}
.footer-links p a {color:#878787;font-size:0.75em;text-decoration:none;padding-left:0.5em;padding-right:0.5em;}