/*
	1st Metro Locksmiths
	Screen CSS Stylesheet

	Written by Sam Clark
	(c) 2007 1st Metropolitian Locksmiths
*/

html, body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	font-family:Verdana,"Trebuchet MS", arial, sans-serif ;
	font-size:12px;
	background:url('../images/background.jpg') top repeat-x #acc6ed;
	color:#333;
}

.hidden {
	display:none;
}

.clearFloats {
	clear:both;
}

h1, h2, h3, h4, h5, h6 {
	font-weight:bold;
  color:#5271A0;
}

/*
	=============================
	MAIN PAGE STYLE
	=============================
*/

#page {
	width:850px;
	margin:0 auto;
}

#page #header {
	padding:0;
	margin:0;
}

#page #header p {
	padding:0;
	margin:0;
}

#page #header p.floatLeft {
	float:left;
}

#page #header p.floatRight {
	float:right;
}

#page #header p#callNowTop {
	margin:10px 0;
	display:block;
	text-decoration:none;
	width:275px;
	height:65px;
	background:url('../images/header_callnow.jpg') top left no-repeat;
	text-indent:-9999px;	
}

#page #header p a#metrologo {
	margin:10px 0;
	display:block;
	text-decoration:none;
	width:250px;
	height:65px;
	background:url('../images/logo.jpg') top left no-repeat;
	text-indent:-9999px;
}


/*
	=============================
	MAIN MENU STYLE
	=============================
*/

#page ul#mainmenu {
	position:relative;
	background:url('../images/background_menubar3.png') top center no-repeat;
  background-position:center 6px;
	width:850px;
	min-height:35px;
	margin:0;
	left:-5px;
	padding:3px 5px;
  font-size:1.2em;
  height:35px;
}

#page ul#mainmenu li {
	position:relative;	
	display:inline;
	top:13px;
	list-style:none;
	padding:18px;
  padding-left:14px;
  padding-right:14px;
	margin:0;
  font-weight:bold;
}

#page ul#mainmenu li a {
	font-family:"Gill Sans", arial, sans-serif;
	text-transform:uppercase;
	text-decoration:none;
	font-size:90%;
	color:#f0f0f0;
}


#page ul#mainmenu li a.active, #page ul#mainmenu li a:hover {
	color:#fff;
	border-bottom:1px dotted #fff;
}

/*
	=============================
	CONTENT STYLE
	=============================
*/

#page #content {
	clear:both;
}

#page #content #frame {
	margin:0 0 0 -5px;
	padding:0 5px;
	width:850px;
	background:url('../images/background_content.png') center repeat-y;
}

#page #content #frame #leftframe {
	width:609px;
	float:left;
	margin:0;
	padding:20px;
	background:#fff;
	border-right:1px solid #cacaca;
}

#page #content #frame #leftframe h1#welcome {
	padding:0px 0px 40px 140px;
	margin:0px 0px 5px 0px;
	font-size:120%;
	background:url('../images/key.jpg') no-repeat top left;
	background-position:20px 10px;
	border-bottom:1px solid #cacaca;
}

#page #content #frame #leftframe h1#welcome strong {
	color:#6d8fc1;
}

#page #content #frame #leftframe h2 {
	padding:0;
	margin:0 0 10px 0;
	font-size:150%;
	font-weight:800;
}

#page #content #frame #leftframe h2 a {
	display:block;
	color:#6d8fc1;
	text-decoration:none;
	width:100%;
	padding:0px 0;
}

#page #content #frame #leftframe h2 a:hover {
	color:#ff0000;
}

#page #content #frame #leftframe p {
	font-size:100%;
  line-height:1.6em;
}

#page #content #frame #leftframe ul li {
	font-size:100%;
  line-height:1.6em;
}

#page #content #frame #leftframe ol li {
	font-size:100%;
  line-height:1.6em;
}

#page #content #frame #leftframe #innerleft {
	float:left;
	width:283px;
	padding:0 20px 0 0;
}

#page #content #frame #leftframe #innerleft h2 a {
	background:url('../images/sprite_van.jpg') top right no-repeat;
  padding-right:122px;
  width:auto;
  height:60px;
}

#page #content #frame #leftframe #innerright {
	float:right;
	width:283px;
	padding:0 0 0 20px;
	border-left:1px solid #cacaca;
}

#page #content #frame #leftframe #innerright h2 a {
	background:url('../images/sprite_entry.jpg') top right no-repeat;
  height:60px;
}


#page #content #frame #rightframe {
	width:200px;
	height:100%;
	float:right;
	margin:0;
	padding:0;
}

.tips li{
margin: 0 0 10px 0;
}
/**
 * About block
 */

#padlock {
  float:right;
  width:70px;
  padding-right:5px;
}

#padlock-image {
  position:absolute;
  margin-top:-45px;
  background-image:url(/assets/images/padlock.gif);
  background-repeat:no-repeat;
  width:70px;
  height:95px;
}

#aboutus {
  margin:4px;
  background-color:#E0E0E0;
  border:solid 1px #CACACA;
  padding:3px 3px 0px 3px;
  margin-top:50px;
}

#aboutus h2 {
  text-transform:uppercase;
  font-size:1.2em;
  margin:18px 0 0 0;
}

#aboutus h2 a {
	font-weight:bold;
  color:#5271A0;
  text-decoration:none;
}

.rightsideblock {
  margin:10px 4px;
  background-color:#E0E0E0;
  border:solid 1px #CACACA;
  padding:3px;
}
.rightsideblock h2 {
  text-transform:uppercase;
  font-size:1.2em;
  margin:0.2em 0 0.2em 0;
}

.rightsideblock p {
  font-size:1em;
}
/**
 * Contact block
 */

#contactus {
  margin:10px 4px;
  background-color:#E0E0E0;
  border:solid 1px #CACACA;
  padding:3px;
}

#contactus h2 {
  text-transform:uppercase;
  font-size:1.2em;
  margin:0.2em 0 0.2em 0;
}

#contactus p {
  font-size:0.9em;
}

#callusbtn {
  color:white;
  text-decoration:none;
  background-image:url(/assets/images/call-button.gif);
  height:27px;
  width:135px;
  text-indent:-32767px;
  display:block;
  cursor:default;
}

#contactusbtn {
  color:white;
  text-decoration:none;
  background-image:url(/assets/images/contact-us.gif);
  height:30px;
  width:160px;
  text-indent:-32767px;
  display:block;
}

#booklocksmithbtn{
  color:white;
  text-decoration:none;
  background:url(/assets/images/book-locksmith-online-red.gif) no-repeat right;
  height:30px;
  width:170px;
  text-indent:-32767px;
  display:block;
  margin: 20px 0;
}

#cutkeysbtn{
  color:white;
  text-decoration:none;
  background:url(/assets/images/cut-keys-online-red.gif) no-repeat right;
  height:30px;
  width:170px;
  text-indent:-32767px;
  display:block;
  margin: 20px 0;
}

#sendemailbtn{
  color:white;
  text-decoration:none;
  background:url(/assets/images/send-email.gif) no-repeat right;
  height:30px;
  width:170px;
  text-indent:-32767px;
  display:block;
  margin: 20px 0;
}

.textcenter{ text-align: center; }

/**
 * Registered address block
 */

#registered_address {
  margin:4px;
  background-color:#E0E0E0;
  border:solid 1px #CACACA;
  padding:3px;
}

#registered_address h2 {
  text-transform:uppercase;
  font-size:1.2em;
  margin:0.2em 0 0.2em 0;
}

#registered_address p {
  font-size:0.9em;
}

/**
 * Forms
 */

.zend_form {
  background-color:white;
  color:#6D8DCA;
}

.zend_form label {
  margin-bottom:3px;
  font-weight:bold;
  font-size:1.2em;
}

.zend_form input, .zend_form textarea, .zend_form select {
  border:solid 1px #CBCBCB;
  margin-bottom:10px;
}

.zend_form select {
  color:#6D8DCA;
}

.zend_form textarea {
  width:400px;
  height:150px;
}

.zend_form fieldset {
  border:none 0px;
  margin:0px;
  padding:0px;
}

#contact_form_left {
  width:40%;
  float:left;
}

#contact_form_right {
  width:60%;
  float:left;
}

#contact_form_enquiry {
  clear:both;
}

#contact_form_bottom {
  clear:both;
}

#contact_dialog {
  padding:10px 12px;
}

#contact_dialog dl.zend_form {
  margin-top:0px;
}

#Submit {
  font-size:1.5em;
  background-color:#6D8DCA;
  color:white;
  font-weight:bold;
}

#contact_form_bottom dt {
  display:none;
}

#contact_form_bottom dd {
  margin-left:0px;
}

#contact_form h2 {
  margin-top:0px;
  text-transform:uppercase;
}

.contact-left {
  float:left;
  width:510px;
}

.contact-right {
  float:left;
  width:210px;
}





#online_order_form label {
  font-size:1em;
  float:left;
  width:150px;
  clear:left;
  color:#1E498A;
}

#key_cutting_requirements label {
  width:auto;
  margin-right:5px;
}

#key_cutting_requirements table {
  width:100%;
}

#online_order_form h3 {
  border-bottom:dotted 1px #cacaca;
}

#online_order_form textarea {
  width:auto;
  height:auto;
}

.small {
  float:right;
  width:200px;
}

.infobox {
  border-bottom:dotted 1px #1E498A;
  border-top:dotted 1px #1E498A;
  color:black;
  background-color:#E8ECF3;
  padding:0px 8px 8px 8px;
  margin-bottom:1em;
}

.infobox ul {
  margin:0px 0px 0px 10px;
  padding:0px;
}

.infobox ul li {
  margin-bottom:4px;
}

.small ul li {
  font-size:0.8em;
}

.infobox h4 {
  margin:0.5em 0em;
  color:#1E498A;
}

/*#online_order_form */

/**
 * Tabs Section
 */

.tabs {
  clear:both;
  min-height:50px;
}

.tabs ul {
  padding:0px;
  margin:0px;
}

.tabs ul li {
  float:left;
  color:white;
  margin-right:2px;
  display:block;
}

.tabs ul li a {
  display:block;
  background-color:#5271A0;
  padding:5px;
  text-decoration:none;
  color:white;
  height:3em;
  width:100px;
  text-align:center;
  font-family:"Trebuchet MS", Verdana, Arial, sans, helvetica;
}

.tabs ul li a.active {
  background-color:#B5002D;
}

.tabs ul li a:hover {
  background-color:#B5002D;
}

/**
 * Brands
 */
#Brands div {	float:left;	width:110px;	text-align:center;	padding-right:5px;	margin:15px 0 5px 0;	font-size:0.9em}


/**
 * Key Cutting
 */
#KeyCuttingContent {	
	background-color:#FFF;	
	margin:0 0 0 0;	
	padding:10px;
	float:left;	
	}
#KeyCuttingContent p {line-height:1.5em}

#KeyCuttingContainer h1, #KeyCuttingContainer h2, #KeyCuttingContainer h3 {font-family: Verdana,"Trebuchet MS", Arial, Helvetica, sans-serif;	font-weight:normal;	margin:0;	padding:0}
#KeyCuttingContainer h1 {	font-size:1.5em;		margin:0;	padding:10px 0px; }
#KeyCuttingContainer h2 {	font-size:1.5em}
#KeyCuttingContainer h3 {	font-size:1.3em}
#KeyCuttingContent a {color:#1E498A}
#KeyCuttingContent a:hover {text-decoration:none}
#KeyCuttingContent h1 {	color:#1E498A}
#KeyCuttingContainer div.OrderPromo, #KeyCuttingContainer div.FullOrderPromo, #KeyCuttingContainer div.OrderInformation {
	float:right;
	text-align:center;
	margin:10px 3%;
	padding:15px 8px;	
	}
#KeyCuttingContainer div.OrderPromo {width:40%}
#KeyCuttingContainer div.FullOrderPromo, div.OrderHelp {width:90%;	float:none}
#KeyCuttingContainer div.OrderInformation {width:35%;	text-align:left;	font-size:0.8em;	padding:10px;}

#KeyCuttingContainer div.Category, #KeyCuttingContainer div.Promo {float:left;	width:29%;	margin:20px 1% 20px 0;	margin-top:20px;	padding:8px;	font-weight:0.7em}

p.PageJump {clear:both;	padding:15px 0}

div.OrderHelp {font-size:0.8em;	margin:25px 0}
div.Category, div.OrderInformation, div.OrderHelp {background-color:#E8ECF3}
div.OrderPromo, div.Category, div.Promo, div.FullOrderPromo, div.OrderInformation, div.OrderHelp {border-top:1px dotted #1E498A;	border-bottom:1px dotted #1E498A}
div.Promo {background: url(../backgrounds/gradiant.jpg) repeat-x left top;	text-align:center}

div.OrderPromo, div.FullOrderPromo {background: url(../backgrounds/dark-panel.gif) repeat-x left top;	background-color:#7C95BB;	color:#FFF}
#KeyCuttingContent div.OrderPromo h3 a, #KeyCuttingContent div.FullOrderPromo h3 a, #KeyCuttingContent div.OrderPromo h1, #KeyCuttingContent div.FullOrderPromo h1, #KeyCuttingContent div.OrderPromo a, #KeyCuttingContent div.FullOrderPromo a {color:#FFF}

/**
 * Emergency Locksmith
 */

.emergency-locksmith table {
  width:500px;
  margin-bottom:1em;
}

.emergency-locksmith td {
  width:250px;
}

/**
 * Services
 */
.service_image {
  float:left;
  padding-right:10px;
}

.service_image_right {
  float:right;
  padding-left:10px;
}

.section {
  margin-top:5px;
}

.intercom-page .service_image {
  padding-bottom:15px;
}

/**
 * Misc
 */
br.clear {
  height:1px;
  clear:both;
}

ul.errors {
  color:red;
  margin-top:0px;
  margin-bottom:0.5em;
}

dl#faq-list dt {
  font-weight:bold;
  font-size:1.3em;
  background-color:#E0E0E0;
  padding:5px;
}

dl#faq-list dd {
  margin-left:2em;
}

dl#faq-list ul, dl#faq-list ol {
  margin:1em 0px;
}

/**
 * Footer
 */

#footer {
  font-size:0.8em;
  padding-bottom:1em;
}

h3.freephone {
  padding:5px;
  color:white;
  background-color:#5271A0;
  font-size:1.5em;
}

p.highlight {
  background-color:#E0E0E0;
  padding:5px;
}