/*
Theme Name: Krisco's Welding
Theme URI: http://kriscoswelding.com/
Description: Krisco's Welding website design
Author: Alex Wong
Version: 1.0
*/


@font-face {
    font-family: 'Roboto';
    src: url('roboto-light-webfont.eot');
    src: local('Roboto Light'),
		 url('fonts/roboto-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto-light-webfont.woff2') format('woff2'),
         url('fonts/roboto-light-webfont.woff') format('woff'),
         url('fonts/roboto-light-webfont.ttf') format('truetype'),
         url('fonts/roboto-light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('roboto-medium-webfont.eot');
    src: local('Roboto Medium'),
		 url('fonts/roboto-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto-medium-webfont.woff2') format('woff2'),
         url('fonts/roboto-medium-webfont.woff') format('woff'),
         url('fonts/roboto-medium-webfont.ttf') format('truetype'),
         url('fonts/roboto-medium-webfont.svg#robotomedium') format('svg');
    font-weight: bold;
    font-style: bold;
}



article,aside,details,figcaption,figure,
footer,header,hgroup,menu,main,nav,section { 
display:block;
}

body{
margin:0;
padding:0;
background:white;
font-family:Arial, Helvetica, sans-serif;
min-width:1000px;
}

header{
height:120px;
width:100%;
position:fixed;
z-index:1000;
box-shadow:0 0 10px rgba(0,0,0,0.5);

background:white;
background: -moz-linear-gradient(top,  rgba(255,255,255,0.85) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.85)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.85) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,0.85) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,0.85) 0%,rgba(255,255,255,1) 100%); /* W3C */
}

#mobile-menu{
display:none;	
}

	#header-content{
	width:1000px;
	margin:auto;	
	position:relative;
	display:table;
	height:100%;
	}
	
		#logo{
		display:table-cell;
		vertical-align:middle;
		height:100%;
		width:230px;
		padding-left:20px;
		}
		
		nav{
		display:table-cell;
		vertical-align: middle;
		height:100%;
		text-align:right;
		font-family:Roboto, Arial, Helvetica, sans-serif;
		}
		

	
		#nav-main a{
		color:black;
		font-size:18px;
		padding:5px 10px;
		transition:0.3s;
		display:inline-block;
		}
		
		#nav-main .current-menu-item a,
		#nav-main a:hover,
		footer a:hover{
		color:#DB0800 ;	
		}
		


		ul.menu{
		margin:0;
		padding:0;
		list-style-type:none;
		}
		
			ul.menu li{
			margin:0;
			padding:0;
			display:-moz-inline-box;
			-moz-box-orient: vertical;
			display:inline-block;
			*display:inline;
			*zoom:1;	
			}
		
		#nav-main .home{
		display:none;
		}
			
		#header-contact{
		position:absolute;
		background:#DB0800;
		font-size:12px;
		font-weight:bold;
		padding:8px 5px;
		color:white;
		white-space:nowrap;
		right:0;
		top:120px;
		box-shadow:0 5px 10px rgba(0,0,0,0.5);
		z-index:900;
		}
			
			#header-contact li{
			padding:0 6px;	
			}
			
			#header-contact a{
			color:white;
			transition:0.3s;
			}
			
			#header-contact a:hover{
			text-shadow:0 0 10px white;
			}

#banner{
position:fixed;
top:0;
left:0;	
overflow:hidden;
z-index:1;
}

	#banner img{
	display:block;
	width:100%;
	height:auto;
	min-width:1000px;
	position:relative;
	top: -5vw;
	}
	

#banner-strut{
padding-top:50%;
}



		
main{
position:relative;	
z-index:20;
}

#main-content{
	
}
			
article{
background:url(images/clouds.jpg) repeat-x  #d5dce2;
color:#444;
font-size:0.9em;
border-top:12px solid #DB0800;
padding:20px 0 20px 0;
position:relative;
z-index:10;
}

	article

	#article-content{
	width:900px;
	margin:auto;
	position:relative;
	}

	main h1{
	display:none;	
	}
	
	h2{
	font-family:Roboto, Arial, Helvetica, sans-serif;
	font-size:22px;
	font-weight:normal;
	margin: 0.5em 0;
	color:black;
	}
	
		.intro{
		font-family:Roboto, Arial, Helvetica, sans-serif;
		color:#790400;
		font-size:30px;
		line-height:120%;
		}
		
			.intro strong{
			text-transform:uppercase;
			font-size:23px;
			}
			

		
		.accent{
		font-family:Roboto, Arial, Helvetica, sans-serif;
		font-size:25px;
		}
		
			.accent-text strong{
			text-transform:uppercase;
			font-size:20px;	
			}
		
	p{
	margin:0.5em 0;
	}
	article ul{
	margin:0.5em 0;
	}


	
	.column{
	display:inline-block;
	*display:inline;
	*zoom:1;
	vertical-align:top;
	width:48%;
	}
	
	.column:first-child{
	margin-right:3.5%;	
	}
	
	.columns.three .column{
	width:30%;
	margin-right:3%;	
	}
	

#feature{
position:relative;
background:url(images/feature-bg.jpg) no-repeat top center #020202;
color:white;
padding:30px 0;
z-index:20;
}
	
	#feature-content{
	width:900px;
	margin:auto;
	}

	#feature a{
	color:white;	
	}

aside{
background:url(images/sidebar-bg.jpg) no-repeat top left #620000;
color:white;
font-size:18px;
font-family:Roboto, Arial, Helvetica, sans-serif;
line-height:150%;
box-shadow:0 0 10px rgba(0,0,0,1);
position:absolute;
z-index:100;
top:-20px;
margin-left:50%;
left:100px;
right:0;
}




	
	#aside-content{
	padding:15px 30px;		
	}
	
	aside a{
	color:white;
	transition:0.3s;
	font-weight:bold;
	}
	
	aside a:hover{
	text-shadow:0 0 10px white;	
	}
	
	
	aside p{
	margin: 0.5em 0;	
	}


footer{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#666666;
width:100%;
margin:auto;
position:relative;
z-index:10;
padding:10px 0 30px 0;
background:white;
line-height: 1.5;
}
	
	#footer-content{
	width:900px;
	margin:auto;
	}
	
	footer ul.menu li{
	margin:0 5px;	
	}
	
		footer ul.menu li:first-child{
		margin-left:0;	
		}
	
	footer a{
	color:#666666;	
	}

	

	
a{
text-decoration:none;
color:#DB0800;
transition:0.3s;
}

article a:hover{
color:#790400;	
}

img{
border:0;	
}




/*Home*/

#home #feature{
}
	
	.homelinks p{
	display:inline-block;
	vertical-align:top;
	margin:0;
	position:relative;
	}
	
		.homelinks a{
		display:inline-block;
		border:2px solid #666;
		border:2px solid rgba(255,255,255,0.3);
		height:50px;
		width:190px;
		padding:10px 8px 2px 10px;
		text-align:center;
		margin-right:20px;
		position:relative;
		transition:0.3s;
		}
		
		.homelinks a[href*='health'] {
		line-height:40px;
		width:170px;
		}
		
		
		.homelinks p:after{
		content:url(images/feature-arrow.png);
		position:absolute;
		top:20px;
		left:-10px;
		z-index:50;
		}
		
		.homelinks a:hover{
		border:2px solid white;
		}
	
#home aside{
position:absolute;
margin-left:50%;
margin-top:-112px;
top:auto;
left:235px;
right:0;
z-index:50;
}


/*About*/
#about #article-content{
width:600px;
margin-left:50%;
left:-480px;
}

	#about aside{
	left:120px;	
	}

	#about #aside-content{
	width:360px;
	}
		
#about .column:first-child{
margin-right:2%
}
#about .column:last-child{
width:35%;	
}


/*Health Safety*/
#health-safety #article-content{
width:580px;
margin-left:50%;
left:-480px;
}


	#health-safety aside{
	left:120px;
	}
	
		#health-safety #aside-content{
		width:300px;
		}
		
/*Contact*/

#contact aside{
left:20px;
}

#contact #article-content{
width:350px;
margin-left:50%;
left:-450px;
}

	#contact #aside-content{
	width:420px;
	}

	#google-map{
	width:100%;
	height:300px;	
	}