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

/* 
Phoenix Steel


*/

html {
height:100%;
font-size: 62.5%;
}

body	{
height:100%;
background:#ccc url(../images/bg_body.gif) repeat-x;
color:#222;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
margin:0;
padding:0;
}

body.home	{
background:#ccc url(../images/bg_body-home.gif) repeat-x;
}


	
	




p  {
padding:0;
margin:0 0 14px 0;
}

td, th	{
color:#222;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}

a  {
color:#222e66;
text-decoration:underline;
}
a:hover  {
color:#b72c27;
}
a:focus {
outline:none;
}

a img	{
border:0;
}

div, span  {
margin:0;
padding:0;
}

form  {
margin:0;
padding:0;
}
input, textarea   {
}

h1	{
color:#b72c27;
font-size:30px;
font-weight:normal;
padding:0;
margin:0 0 14px 0;
}
h2	{
color:#b72c27;
font-size:19px;
font-weight:normal;
border-bottom:1px solid #b72c27;
padding:0 0 3px 0;
margin:0 0 11px 0;
}
h3	{
color:#b72c27;
font-size:19px;
font-weight:normal;
padding:0;
margin:0 0 14px 0;
}
h4	{
color:#b72c27;
font-size:19px;
font-weight:normal;
padding:0;
margin:0 0 14px 0;
}
h5	{
color:#b72c27;
font-size:19px;
font-weight:normal;
padding:0;
margin:0 0 14px 0;
}
h6	{
color:#b72c27;
font-size:15px;
font-weight:bold;
padding:0;
margin:0 0 14px 0;
}

/* */

.button	{
display: inline-block;
overflow:hidden;
color:#fff;
font-family: "HelveticaNeue_Light", Helvetica, Arial, "Lucida Grande", sans-serif;
font-size:15px;
font-size:1.5rem;
text-decoration:none;

background: #8a8b8d;
background: -moz-linear-gradient(top,  #8a8b8d 0%, #4e5253 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a8b8d), color-stop(100%,#4e5253));
background: -webkit-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: -o-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: -ms-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: linear-gradient(to bottom,  #8a8b8d 0%,#4e5253 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8b8d', endColorstr='#4e5253',GradientType=0 );

border:2px solid #000;
border-radius:5px;
padding:5px 15px;
}
input.button	{
}
.button:hover	{
background:#4e5253;
cursor:pointer;
}



.pageWrap	{
max-width:940px;
background:#fff;
-moz-box-shadow:
0 1px 8px 0 rgba(0,0,0,0.6);
-webkit-box-shadow:
0 1px 8px 0 rgba(0,0,0,0.6);
box-shadow:
0 1px 8px 0 rgba(0,0,0,0.6);
margin:0 auto;
}

header	{
position:relative;
height:104px;

background: #d60f0c;
background: -moz-linear-gradient(top,  #d60f0c 0%, #b40101 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d60f0c), color-stop(100%,#b40101));
background: -webkit-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -o-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -ms-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: linear-gradient(to bottom,  #d60f0c 0%,#b40101 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60f0c', endColorstr='#b40101',GradientType=0 );
}

header .logo	{
position:absolute;
right:30px;
display:block;
width:363px;
height:145px;
background:url(../images/Phoenix-Steel-Structural-Steel-Specialists.png);
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
border-radius:0 0 6px 6px;
-moz-box-shadow:
0 1px 4px 0 rgba(0,0,0,0.7);
-webkit-box-shadow:
0 1px 4px 0 rgba(0,0,0,0.7);
box-shadow:
0 1px 4px 0 rgba(0,0,0,0.7);
z-index:9999;
}

@media (max-width: 800px) {
header	{
height:85px;
}
header .logo	{
right:0;
width:300px;
height:120px;
border-radius:0 0 0 6px;
}
}

@media (max-width: 480px) {
header	{
height:70px;
}
header .logo	{
width:250px;
height:100px;
}
}

@media (max-width: 400px) {
header	{
height:65px;
}
header .logo	{
width:213px;
height:85px;
}
}


/* Nav top */

.navTop	{
position: absolute;
bottom:0;
z-index:99999;
}

@media (max-width: 855px) {
.navTop	{
width:300px;
}
}

.navTop .mobileNav	{
}
.navTop ul	{
list-style:none;
padding:0;
margin:0;
}
.navTop ul li {
float:left;
position:relative;
border-top:1px solid #901b17;
border-bottom:1px solid #901b17;
margin:0;
padding:0;
}

.navTop ul li:last-child {
border-right:1px solid #d05b58;
}

.navTop ul li.current {
}

.navTop ul li:hover {
position:relative;
}

.navTop ul li.current a {
background:#f0f0f0;
}

.navTop ul li a {
display:block;
color:#fff;
font-size:12px;
font-size:1.2rem;
text-decoration:none;
text-transform:uppercase;
text-shadow: 1px 1px 1px #000;

background: #d60f0c;
background: -moz-linear-gradient(top,  #d60f0c 0%, #b40101 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d60f0c), color-stop(100%,#b40101));
background: -webkit-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -o-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -ms-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: linear-gradient(to bottom,  #d60f0c 0%,#b40101 100%);

border-top:1px solid #d05b58;
border-right:1px solid #901b17;
border-left:1px solid #d05b58;
padding:10px 15px;
}

.navTop ul li:hover a {
text-shadow: 1px 1px 3px #000;
background:#da0000;
z-index:92;
}

.navTop ul li ul li,
.navTop ul li:hover ul li {
float:none;
display:block;
height:auto;
width:auto;
text-decoration:none;
border:0;
padding:0;
margin:0;
}
.navTop ul li ul li:hover {
background:none;
}
.navTop ul li ul li:last-child {
font-weight:normal;
}
.navTop ul li ul li a,
.navTop ul li:hover ul li a {
display:block;
height:auto;
color:#575757;
font-size:14px;
font-size:1.4rem;
line-height:17px;
line-height:1.7rem;
text-decoration:none;
text-transform:none;
background:#b9e0df;
border:0;
border-radius:0;
-webkit-box-shadow: 
0 0 0 0 rgba(0,0,0,0);
-moz-box-shadow: 
0 0 0 0 rgba(0,0,0,0);
box-shadow: 
0 0 0 0 rgba(0,0,0,0);
padding:4px 18px 3px 23px;
margin:0;
}

.navTop ul li:hover ul li:hover {
}
.navTop ul li ul li.current {
}
.navTop ul li ul li.current a {
}
.navTop ul li ul li a:hover	{
color:#575757;
text-decoration:none;
background:#c6edec;
}

.navTop ul li div {
display:none;
position:absolute;
top:33px;
left:0;
width:210px;
}
.navTop ul li div span {
position:absolute;
top:0px;
left:25px;
display:block;
background:url(../images/arrow_down.png);
width:14px;
height:14px;
z-index:99;
}
.navTop ul li:hover div,
.navTop ul li:focus div {
display:block;
}

.navTop ul li div ul {
background:#b9e0df;
border-radius:0 0 10px 10px;
-webkit-box-shadow: 
0 5px 4px 0 rgba(0,0,0,0.3);
-moz-box-shadow: 
0 5px 4px 0 rgba(0,0,0,0.3);
box-shadow: 
0 5px 4px 0 rgba(0,0,0,0.3);
padding:15px 0;
z-index:99;
}

.navTop ul li:hover ul li ul li {
background:none;
background:#CCCCCC no-repeat;
}
.navTop ul li:hover ul li ul li:hover {
background-position:0 -40px;
}

.navTop ul li:hover ul li ul {
display:none;
left:165px;
top:0;
padding-left:2px;
}
.navTop ul li ul li:hover ul {
display:block;
}

/* Small screen nav */

@media (max-width: 640px) {
.navTop	{
bottom:auto;
top:15px;
left:15px;
}

.navTop .mobileNav	{
position:absolute;
width:60px;
height:35px;
background: rgb(87,87,87);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(128,128,128,1)), color-stop(100%,rgba(87,87,87,1)));
background: -webkit-linear-gradient(top,  rgba(128,128,128,1) 0%,rgba(87,87,87,1) 100%);
background: -moz-linear-gradient(top,  rgba(128,128,128,1) 0%, rgba(87,87,87,1) 100%);
background: -o-linear-gradient(top,  rgba(128,128,128,1) 0%,rgba(87,87,87,1) 100%);
background: -ms-linear-gradient(top,  rgba(128,128,128,1) 0%,rgba(87,87,87,1) 100%);
background: linear-gradient(to bottom,  rgba(128,128,128,1) 0%,rgba(87,87,87,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#808080', endColorstr='#575757',GradientType=0 );

border:1px solid #575757;
border-top:1px solid #898989;
border-bottom:1px solid #252525;
border-radius:4px;
-webkit-box-shadow:
inset 0 1px 0 0px rgba(255,255,255,0.5),
0 1px 0 0px rgba(255,255,255,0.4);
-moz-box-shadow:
inset 0 1px 0 0px rgba(255,255,255,0.5),
0 1px 0 0px rgba(255,255,255,0.4);
box-shadow:
inset 0 1px 0 0px rgba(255,255,255,0.5),
0 1px 0 0px rgba(255,255,255,0.4);
z-index:999999;
}
.navTop:hover .mobileNav	{
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(87,87,87,1)), color-stop(100%,rgba(128,128,128,1)));
background: -webkit-linear-gradient(top,  rgba(87,87,87,1) 0%,rgba(128,128,128,1) 100%);
background: -moz-linear-gradient(top,  rgba(87,87,87,1) 0%, rgba(128,128,128,1) 100%);
background: -o-linear-gradient(top,  rgba(87,87,87,1) 0%,rgba(128,128,128,1) 100%);
background: -ms-linear-gradient(top,  rgba(87,87,87,1) 0%,rgba(128,128,128,1) 100%);
background: linear-gradient(to bottom,  rgba(87,87,87,1) 0%,rgba(128,128,128,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#575757', endColorstr='#808080',GradientType=0 );

border:1px solid #575757;
border-top:1px solid #252525;
border-bottom:1px solid #898989;
}

.navTop .mobileNav span.mobileClick	{
position:absolute;
right:0;
display:block;
width:60px;
height:35px;
cursor:pointer;
z-index:99999;
}
.navTop .mobileNav span.mobileClick em	{
position:absolute;
top:10px;
right:10px;
display:block;
width:40px;
height:1px;
background:#c6c6c6;
border-bottom:1px solid #c6c6c6;
opacity:0.9;
cursor:pointer;
-webkit-transition:0.2s;
-moz-transition:0.2s;
transition:0.2s;
}
.navTop .mobileNav span.mobileClick em:nth-child(n+2)	{
top:17px;
}
.navTop .mobileNav span.mobileClick em:nth-child(n+3)	{
top:24px;
}

.navTop:hover .mobileNav span.mobileClick em,
.navTop .mobileNav.open span.mobileClick em	{
background:#fff;
border-bottom:1px solid #fff;
}


.navTop .mobileNav.open	{

opacity:0.93;
z-index:999999;
}

.navTop .mobileNav ul	{
position: absolute;
top:30px;
width:0;
height:0;
overflow:hidden;
list-style:none;
border:0;
padding:5px 0 10px 0;
margin:0;
}

.navTop .mobileNav ul li ul	{
padding-top:0;
}

.navTop .mobileNav.open ul	{
display:block;
width:250px;
height:auto;
}

.navTop ul li {
float:none;
border:0;
}

.navTop ul li a {
background: #333333;
border:0;
border-bottom:1px solid #666666;
padding-left:15px;
}

.navTop ul li:hover a {
background: #666666;
border-radius:0;
-webkit-box-shadow: 
0 0 0  0 rgba(0,0,0,0);
-moz-box-shadow: 
0 0 0  0 rgba(0,0,0,0);
box-shadow: 
0 0 0  0 rgba(0,0,0,0);
z-index:92;
}

.navTop ul li ul li a,
.navTop ul li:hover ul li a {
padding-left:25px;
}

.navTop ul li div {
display:block;
position: relative;
top:0;
left:0;
width: auto;
}
.navTop ul li div span {
display:none;
}

.navTop ul li div ul {
border-radius:0;
-webkit-box-shadow: 
0 0 0 0 rgba(0,0,0,0);
-moz-box-shadow: 
0 0 0 0 rgba(0,0,0,0);
box-shadow: 
0 0 0 0 rgba(0,0,0,0);
}

}
/* // Small screen nav */



.slidesWrap	{
position:relative;
color:#fff;
max-width:940px;
background:#fff;
padding-top:1px;
}
.slidesWrap img.shuffle	{
width:100%;
}

body.home .slidesWrap	{
overflow:hidden;
}

.slides {
position:relative;
display: none;
margin:0 auto;
}


.slides .slidesjs-play,
.slides .slidesjs-stop {
position:absolute;
bottom:0;
left:0;
font-size:13px;
font-size: 1.3rem;
text-decoration:none;
text-align:center;
padding:3px 10px 3px 15px;
background:#fff;
-webkit-transition:0.3s;
-moz-transition:0.3s;
transition:0.3s;
opacity:0;
z-index:9999;
}
.slides:hover .slidesjs-play,
.slides:hover .slidesjs-stop {
opacity:0.7;
}
.slides:hover .slidesjs-play:hover,
.slides:hover .slidesjs-stop:hover {
text-decoration:underline;
opacity:1;
}



.contentWrap	{
padding:24px 30px;
}
@media (max-width: 800px) {
.contentWrap	{
padding:24px 15px;
}
}

.content	{
}

body.home .content	{
float:left;
width:59%;
}
@media (max-width: 900px) {
body.home .content	{
width:55%;
}
}
@media (max-width: 750px) {
body.home .content	{
width:50%;
}
}
@media (max-width: 640px) {
body.home .content	{
float:none;
width:100%;
}
}

.content .colLeft,
.content .colRight	{
float:left;
width:425px;
margin-top:10px;
}
.content .colRight	{
margin-left:30px;
}

.callOuts	{
float:right;
width:300px;
padding-top:5px;
}
@media (max-width: 640px) {
.callOuts	{
float:none;
}
}
@media (max-width: 350px) {
.callOuts	{
width:100%;
}
}
.callOuts a	{
position:relative;
display:block;
height:66px;
text-decoration:none;

background: #8a8b8d;
background: -moz-linear-gradient(top,  #8a8b8d 0%, #4e5253 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8a8b8d), color-stop(100%,#4e5253));
background: -webkit-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: -o-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: -ms-linear-gradient(top,  #8a8b8d 0%,#4e5253 100%);
background: linear-gradient(to bottom,  #8a8b8d 0%,#4e5253 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a8b8d', endColorstr='#4e5253',GradientType=0 );

border:2px solid #000;
border-radius:5px;
margin-bottom:15px;
}
.callOuts a span	{
position:absolute;
top:10px;
left:16px;
color:#fff;
font-size:14px;
line-height:16px;
text-shadow: 1px 1px 1px #000;
}
@media (max-width: 350px) {
.callOuts a span	{
left:9px;
}
}
.callOuts a em	{
font-style:normal;
}
.callOuts a img	{
position:absolute;
}
.callOuts a img.contact	{
top:-8px;
right:11px;
}
.callOuts a img.whatWeDo	{
top:-6px;
right:3px;
}
.callOuts a img.photos	{
top:-7px;
right:5px;
}
.callOuts a:hover	{
background:#4e5253;
}
.callOuts a:hover em	{
text-decoration:underline;
}


.contactLeft	{
float:left;
width:35%;
margin-right:3%;
}
.contactRight	{
float:left;
width:62%;
}

@media (max-width: 600px) {
.contactLeft	{
float:none;
width:100%;
margin-right:0;
}
.contactRight	{
float:none;
width:100%;
}
}



.tableForm	{
border:1px solid #333;
background: #666;
}
.tableForm td,
.tableForm th	{
padding:4px 10px;
vertical-align:top;
}
.tableForm th	{
color:#fff;
text-align:left;
padding-top:6px;
}
.tableForm td	{
}
.tableForm .rowLast th,
.tableForm .rowLast td	{
border:0;
background:#333;
padding:7px 10px;
}
.tableForm tr:hover	{
background: #999;
}

.tableForm .inputText	{
background:#f1f1f1;
border:1px double #333;
}
.tableForm .inputText:focus	{
background:#fff;
border:1px solid #fff;
}



.galleryPhoto	{
float:left;
width:195px;
height:195px;
margin:0 22px 35px 0;
}
a.photoPop	{
display: table-cell;
width:193px;
height:193px;
vertical-align:middle;
text-align:center;
background:#fff;
border:1px solid #e2e2e2;
-moz-box-shadow:	inset 0 0px 50px 5px #ececec;
-webkit-box-shadow:	inset 0 0px 50px 5px #ececec;
box-shadow:			inset 0 0px 50px 5px #ececec;
-webkit-transition:0.2s;
-moz-transition:0.2s;
transition:0.2s;
}
a.photoPop:hover	{
background:#ececec;
}
a.photoPop img	{
max-width:140px;
max-height:140px;
}
a.photoPop:hover img	{
max-width:146px;
max-height:146px;
-webkit-box-shadow:
0 0 0px 2px rgba(255,255,255,1),
2px 2px 10px 2px rgba(0,0,0,0.8);
-moz-box-shadow:
0 0 0px 2px rgba(255,255,255,1),
2px 2px 10px 2px rgba(0,0,0,0.8);
box-shadow: 
0 0 0px 2px rgba(255,255,255,1),
2px 2px 10px 2px rgba(0,0,0,0.8);
}

.smallScreen	{
display:none;
padding:12px 0;
}
.smallScreen p	{
font-size:15px;
margin-bottom:5px;
}


@media (max-width: 700px) {
a.photoPop	{
display:none;
}
.smallScreen	{
display:block;
}
.galleryPhoto,
.smallScreen img	{
float:none;
width:100%;
height:auto;
margin-bottom:10px;
}
}



.contactForm	{
margin-bottom:20px;
}
.inputText::-webkit-input-placeholder {
color: #999999;
font-style:italic;
}
.inputText:-moz-placeholder {
color: #999999;
font-style:italic;

}
.inputText::-moz-placeholder {
color: #999999;
font-style:italic;
}
.inputText:-ms-input-placeholder {  
color: #999999;
font-style:italic; 
}
.contactForm input.inputText,
div.sentContact,
.contactForm textarea	{
width:94%;
color:#000;
font-size:14px;
font-size: 1.4rem;
background:transparent;
border:0;
-moz-box-shadow: 	inset 0 0 15px 0 rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 0 15px 0 rgba(0,0,0,0.2);
box-shadow:  		inset 0 0 15px 0 rgba(0,0,0,0.2);
outline:none;
border-radius:4px;
padding:5px 9px;
margin:0 0 8px 0;
}
.contactForm label.error	{
display:block;
text-shadow:none;
padding:2px 9px 3px 9px;
margin:-8px 0 16px 0;
}


.contactForm input.inputText:focus,
.contactForm textarea:focus	{
background:#f0f0f0;
border:1px solid #666;
-moz-box-shadow: 	1px 1px 5px 0 rgba(0,0,0,0.6);
-webkit-box-shadow: 1px 1px 5px 0 rgba(0,0,0,0.6);
box-shadow:  		1px 1px 5px 0 rgba(0,0,0,0.6);
margin-bottom:6px;
}
div.sentContact	{
max-width:400px;
padding:12px 9px 10px 9px;
}


footer	{
position:relative;

background: #d60f0c;
background: -moz-linear-gradient(top,  #d60f0c 0%, #b40101 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d60f0c), color-stop(100%,#b40101));
background: -webkit-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -o-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: -ms-linear-gradient(top,  #d60f0c 0%,#b40101 100%);
background: linear-gradient(to bottom,  #d60f0c 0%,#b40101 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60f0c', endColorstr='#b40101',GradientType=0 );

border-bottom:1px solid #fff;
}
footer nav	{
float:left;
margin:36px 0 10px 30px;
}
footer nav a	{
float:left;
color:#fff;
font-size:12px;
line-height:20px;
text-decoration:none;
white-space:nowrap;
margin-right:16px;
}
footer nav a:hover	{
color:#fff;
text-decoration:underline;
}

footer img	{
float:right;
margin:8px 30px 12px 0;
}


.credits	{
max-width:910px;
font-size:10px;
text-align:right;
padding:10px 20px 0 0;
margin:0 auto;
}


.printYes	{
display:none;
}
.floatLeft	{
float:left;
}
.floatRight	{
float:right;
}
.clearBoth	{
clear:both;
}