
/*Total Fencing Solutions master stylesheet V2 October 2015*/
/*Body ------------------------------------------------------------------------*/
@import "resetH5.css";

/* Accessibility , Image replacement, responsive*/
.hide
{
	margin-left:-9999px;
	position:absolute;
	}
 img
{
	 max-width:100%;
	}
.group:after 
{
	visibility: hidden;
	display: block;
	content: "";
	clear: both;
	height: 0;
	}

/*General styles ----------------------------------------------------------------*/
/*Typography ---------*/
/*Font*/
h1,
nav a,
blockquote,
.mobile_nav a,
.sec article h2,
form h2,
 aside h1,
 cite,
 .pg h2
{
	font-family:'Open Sans Condensed', arial,sans-serif;
}
header p,
header div.phone,
article a
{ 
	font-family:arial, sans-serif;
}
body,
.test blockquote
{
	font-family:verdana;
}
/*Color*/
.mobile_nav a,
article h1,
nav a,
footer.pageFooter div,
footer.pageFooter div h1,
footer.pageFooter div a
{
	color:#fff;
}
h1,
article a,
header p,
header div.phone,
header div.phone  a,/*ipad/iphone treat phone numbers as links*/
.sec article h1,
.sec article h2,
form h2,
.pg h2
{
	color:#d60000;
}
header div.phone b,
footer.pageFooter a:hover,
a:hover
{
	color:#000;
}
/*Size*/
h1
{
	font-size:2.5em;
}
.sec article h1,
.pg h2
{
	font-size:1.9em;
}
.sec article h2,
form h2
{
	font-size:1.7em;
}
aside h1
{
	font-size:1.5em;
}
article a,
header div.phone,
nav a,
article h1,
blockquote,
.mobile_nav a,
input[type="submit"],
cite
{
	font-size:1.3em;
}
body,
article a.article_head,
select,
.test blockquote
{
	font-size:1em;
}
footer.pageFooter p
{ 
font-size:0.9em;
}
header p
{ 
font-size:0.8em;
}
/*Emphasis-------*/
header div.phone  a,/*ipad/iphone treat phone numbers as links*/
footer.pageFooter div .phone a,
footer.pageFooter div .mobile a
{
	text-decoration:none;
}
h1,
header div.phone b,
.sec article h2,
form h2,
.pg h2
{
	font-weight:normal;
}
header div.phone,
main cite
{
	font-weight:bold;
}
article h1,
nav a,
.mobile_nav a,
form h2,
aside h1,
.pg h2
{
	text-transform:uppercase;
}
header div.phone
{
	font-style:italic;
}
header div.phone b,
cite
{
	font-style:normal;
}
/*readability------*/
nav a,
.mobile_nav a
{
	text-decoration:none;
}
p,
main blockquote
{
	line-height:1.7;
}
/* content -----------------------------------------------------------------*/	
body
{
	-webkit-text-size-adjust: 100%;
  	-ms-text-size-adjust: 100%;
  	-webkit-font-smoothing: antialiased;
  	background:white;
		}
#container_wrapper
{
	position:relative;
	top:0;
	width:100%;
	min-height:100%;  
   }
.container
{
	max-width:1100px;
	margin:0 auto ;
	position:relative;
	}
header
{
	position:relative;
	top:0;
	z-index:100;
	width:100%;
	background:#fff url(../i/BG_tile_sec.gif) repeat-x ;
}
header div.logo
{
	display:block;
	position:relative;
	top:35px; 
	left:1%;
	width:45%;
	margin-bottom:40px;
}
header div.logo p 
{
	margin-top:-3px;
	}
header div.phone
{
	width:40%;
	height:54px ;
	text-align:right;
	display:inline;
	position:absolute;
	padding-right:53px;
 	right:1%;
 	top:50px;
 	background: url(../i/phone.gif) no-repeat right; 
}
header div.phone b
{
	 font-size:70%;
	 margin:0;
	}
nav 
{
	height:38px;
	padding-bottom:20px;
	z-index:1000;
	position: relative;
	background:#c10000;
	width:100%;
	top:0;
}
nav:after 
{
	position: absolute;
	top:200px;
	content:'';
}
.fixed 
{
	position:fixed;
}
nav ul li
{
	float:left;
	width:16%;
	padding:0 0  ;
	text-align:center;
	 }
nav a
{
	height:30px;	
	padding:14px 0;
}
.mobile_nav_link,
.mobile_nav
{
	display:none;
}
.content_wrap
{
	position:relative;
	top:0;
 	z-index:200;
 	padding:0 1% 200px;
 }
main
{
	padding-top: 40px;
	width:100%;
		}
p.intro
{
	margin:20px 0 ;
	width:100%;
}
article
{
	float:left;
	width:47%;
	margin:10px 1.5% 20px ;
	height:200px;
	border-bottom:1px dotted red;
	padding-bottom:10px;
}
.sec article
{
	float:none;
	width:100%;
	margin:0 0 10px ;
	height:auto;
	border:none;
	padding-bottom:0;
}
article h1
{
	background:#c10000;
	padding:5px 0 5px 4%;
	}
.sec article h1
{
	background:none;
	padding:0;
}
article p
{
	padding:5px 1px 5px 5px;
	height:130px;
	float:right;
	width:70%;
}
.wwa article h1,
.wwa article h2,
.wwa article p
{
	float:left;
	width:70%;
}
.wwd article h1,
.wwd article h2,
.wwd article p
{
	width:100%;
	float:none;
}
.sec article h2
{
	margin:10px 0 0;
}
.sec article p
{
	padding:0 7px 10px 0;
	height:auto;
	}
.sec main ul
{
	list-style:none;
	margin:20px auto 0;
	width:80%;
	line-height:2;
}
.sec main ul li
{
	background:url(../i/bullet.gif) no-repeat 0 10px;
	padding-left:30px;
}
article img 
{
	float:left;
	margin-top:10px;
	width:28%;
}
.wwa article img
{
	float:right;
}
.wwd article img
{
	width:16%;
	margin:20px 25px 10px;
	float:none;
}	
article a.article_head
{
	text-align:left;
	text-decoration:none;
	width:100%;
	}
article a
{
	display:block;
	text-align:right;
	float:right;
	width:40%;
}
.wwd article a
{
	width:auto;
}
 main blockquote
{
	margin:20px 0 5px;
}

footer.pageFooter
{
	position:relative;
	clear:both;
	margin:0 auto;
	background:#c10000;
	height:100%;
	padding:20px 0 50px;
}
footer.pageFooter section div
{
	width:33%;
	color:white;
	float:left; 
	border-right:1px solid white;
	padding:0 20px 10px;
	height:200px;
}
footer.pageFooter section div.contact
{
	margin-left:1%;
}
footer.pageFooter section div.quote footer
{
	margin-top:10px;
}
footer.pageFooter  ul li
{
	margin-left:2%;
	margin-bottom:5px;
	list-style:none;
	line-height:2.4;
	padding-left: 47px ;
	 }
footer.pageFooter  ul li.mobile
{
	background:url(../i/mob_footer_icon.png) no-repeat;
}
footer.pageFooter  ul li.email
{
	background:url(../i/email_footer_icon.png) no-repeat;
}
footer.pageFooter  ul li.phone
{
	background:url(../i/phone_footer_icon.png) no-repeat;
}
footer.pageFooter  div.container
{
	background:url(../i/TFS_footer_logo.png) no-repeat  98% 50%;
}
footer.pageFooter p
{
	width:99%;
	margin:20px auto 0;
	}
footer ul.mobile_nav
{
	display:none;
	}
/*Contact specific----*/
form
{
	margin-top:30px;
	border:1px #e2e2e2 solid;
	padding:20px 5%;
	-webkit-border-radius: 5px ;
	-moz-border-radius: 5px   ;
	border-radius: 5px ;
	background:transparent;
	width:50%;
	float:left;
	}
form h2,
aside h1
{
	border-bottom:1px solid #f0f0e1;
	padding-bottom:10px;
	margin:0 0 30px;
}
form p
{
	margin:0 0 20px 0;
	text-align:right;
	width:90%;
		}
form label
{
	float: left;
	width:30%;
	background:transparent;
	margin: 3px 0 0 0;
	font-size:1.1em;
	font-weight:normal;
	}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea
 {
	border:1px solid #ccc;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px ;
	padding:4px;
	width:67%;
	}
select
{
	height:40px;
	width:69%;
	border:1px solid #ccc;
	padding:10px 4px;
}
option
{
	padding:10px;
	border-top:1px dotted #ccc;
}
input[type="text"],
input[type="email"],
input[type="tel"]
{
	height:25px;
	}
textarea
{
	height:100px;
}
p.control
{
	text-align:center;
}
input[type="submit"]
{
	text-align:center;
	width:60%;
	padding: 10px;
	background:#c10000;
	-webkit-border-radius: 5px ;
	-moz-border-radius: 5px   ;
	border-radius: 5px ;color:#fff;
	border:1px solid #e2e2e2;
	}
input[type="submit"]:hover,
input[type="submit"]:focus
{
	background:#e2e2e2;
	border:1px solid #666;
	color:#737345;
}
.contact aside
{
	margin-top:30px;
	border:1px #e2e2e2 solid;
	padding:20px 5% 30px;
	-webkit-border-radius: 5px ;
	-moz-border-radius: 5px   ;
	border-radius: 5px ;
	background:transparent;
	width:29%;
	float:right;
}
dt
{
	float:left;
	font-weight:bold;
	line-height:3;
	border-bottom:1px #e2e2e2 dotted;
}
dd
{
	text-align:right;
	line-height:3;
	border-bottom:1px #e2e2e2 dotted;
}
dd a
{
	color:#000;
	font-size:0.9em;
}
p.sent
{
	width:55%;
	float:left;
}
/*Photo gallery specific---------*/
.pg main h2
{
	margin-top:15px;
}
.pg main ul
{
	width:100%;
	margin:0;
}
.pg main ul li
{
	background:none;
	float:left;
	margin:0 10px 15px;
	padding:0;
	width:150px;
	line-height:1;
}
.pg main ul li img
{
	width:100%;
}
	