/* CSS Document */

/*   
Description: Design Created by Longevity Graphics
Author: Development by Lindsay Viscount of Longevity Graphics
Author URI: http://www.longevitygraphics.com

Color used:
blue: 081853;
green:216300;
grey:666;
grey:3f4040;
*/


body {
  margin: 0;
  background: #fff url(/images/calgary-railings-bg.jpg) top repeat-x;
  text-align:center;

  margin-left:auto; 
  margin-right:auto;
  font: 14px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
 
}


strong {
  color:#3f4040;
  font-weight:bold;
}

b {
  color:#666;
  font-weight:bold;

}

h1 {
   font: 26px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
   color:#081853;
   font-weight: bold;
   margin-top: 0; 
   margin-bottom: 0;
}

h2 {
   font: 19px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
   color:#666;
   font-weight: bold;
   margin-top: 0; 
   margin-bottom: 0;
   
}

h3 {
   font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
   color:#216300;
   font-weight: bold;
   margin-top: .5em; 
   margin-bottom: 0;
   border-bottom: #3f4040 1px dashed;
}

a{
  text-decoration:none;
}

p {
  font: 16px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#3f4040;
}

#header {
  width:1026px; 
  min-width:1026px;
  margin-left:auto; 
  margin-right:auto;
  text-align:center;
  
}

#headerContent {
  width:1026;
  text-align:left;
}

#logo {
  background: #081853 url(/images/falcon-railings-calgary-logo.jpg) top;
  background-repeat: no-repeat;
  width:200px;
  height:109px;
  pointer:cursor;
  text-indent:-2000px;
}


#home {
  position:relative;
  top:.5em;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:75px;
}

#home:hover {
  color:#081853;
}

#aboutUs {
  position:relative;
  top:.5em;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:100px;
}

#aboutUs:hover {
  color:#081853;
}

#glassRailings {
  position:relative;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:155px;
}


#glassRailings:hover {
  color:#081853;
}

#aluminumRailings {
  position:relative;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
    height:25px;
  width:125px;
}

#aluminumRailings:hover {
  color:#081853;
}

#interiorRailings {
  position:relative;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
    height:25px;
  width:155px;
}

#interiorRailings:hover {
  color:#081853;
}

#exteriorRailings {
  position:relative;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
    height:25px;
  width: 155px;
}

#exteriorRailings:hover {
  color:#081853;
}

#faq {
  position:relative;
  top:.5em;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:75px;
}

#faq:hover {
  color:#081853;
}


#testimonials {
  position:relative;
  top:.5em;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:120px;
}

#testimonials:hover {
  color:#081853;
}

#contactUs {
  position:relative;
  top:.5em;
  font: 17px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666;
  font-weight: bold;
  margin-top: 0; 
  margin-bottom: 0;
  height:25px;
  width:100px;
}

#contactUs:hover {
  color:#081853;
}


#mainIndex {
  margin-top:4em;
  height:750px; 
  width:1026px; 
  min-width:1026px;
  margin-left:auto; 
  margin-right:auto;
  text-align:center;

}

#main {
  margin-top:4em;
  height:600px;
  width:1026px; 
  min-width:1026px;
  margin-left:auto; 
  margin-right:auto;
  text-align:center;

}



#mainGlassRailings {
  position:relative;
  display:inline;
  float:left;
  text-align: left;
}

#worldsBestToplessGlassRailings {
  position: relative;
  left:-2.7em;
  top:-.5em;
}

#railingInformation {
  
  width:509px;
  height:173px;
}

#railingInformation ul { 
  margin-top:-1em;
}

#railingInformation li { 
  list-style-type: none;
  background: url(/images/grey-bullet.gif) no-repeat;
  text-align:left;
  padding-left: 1em;
  padding-bottom: .4em;
}

.railingInfoText {
  
  
}

.railingInfoLink a {
  position:relative;
  top:-1.4em;
  margin-left:27em;
  color:#fff;
  font: 12px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  
  text-decoration:none;
}

.railingInfoLink a:hover {
  position:relative;
  top:-1.4em;
  margin-left:27em;
  color:#fff;
  font: 12px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  font-weight:bold;
  text-decoration:none;
}

#mainContent {
  position:relative;
  display:inline;
  float:left;
  width:450px;
  text-align:left;
  padding:1em;

}

#content {
  position:relative;
  display:inline;
  float:left;
  width:700px;
  text-align:left;
  margin-top:1em;
}

#rightSideNav {
  position:relative;
  display:inline;
  float:right;
  width:250px;
  text-align:left;
  padding:1em;
}

#railingQuote {
  background: #216300 url(/images/railings-quote-bg2.jpg) top;
  background-repeat: no-repeat;
  width:310px;
  height:259px;
  padding:10px;
  font: 14px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#fff;

}

#railingQuote strong {
  color:#fff;
  font: 18px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  font-weight:bold;
}

#railingQuote td {
  color:#fff;
  font: 18px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  
}

#railingQuoteRightSideNav {
  background: #216300 url(/images/right-nav-bg.jpg) top;
  background-repeat: no-repeat;
  width:239px;
  height:426px;
  font: 14px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#003300;

}

#railingQuoteRightSideNav strong {
  color:#fff;
  font: 18px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  font-weight:bold;
}

#railingQuoteRightSideNav td {
  color:#003300;
  font: 18px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  
}

#railingQuoteRightSideNav p {
  color:#003300;
  font: 16px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  font-weight:bold;
  text-align:center;
  
}

#moveRight {
  padding:1em;
  position:relative;
  left:1em;
}

.quoteForm {
  position:relative;
  padding:.2em;
  width:200px;
}

#quoteButton {
  margin-left:15em;
  margin-top:-4.5em;
}

.mainBottomMenu {
  position:relative;
  display:inline;
  float:left;
  width:240px;
  height:100px;
  text-align:left;
  padding:10px;
  color:#216300;
}

#mainBottomMenu a:visited {
   color:#216300;
}

.mainBottomMenu2 {
  position:relative;
  display:inline;
  float:left;
  width:420px;
  height:200px;
  text-align:left;
  padding:10px;
  color:#216300;
}

#mainBottomMenu2 a:visited {
   color:#216300;
}

.mainBottomMenu3 {
  position:relative;
  display:inline;
  float:left;
  top:5em;
  width:480px;
  height:200px;
  text-align:left;
  padding:10px;
  color:#216300;
}

#mainBottomMenu3 a:visited {
   color:#216300;
}

#glassrailings a:visited {
   color:#216300;
}



#mainBottomMenu a:link {
   color:#216300;
}

.whatWeDo {
position:relative;display:block;float:right;width:350px;
}

#whatWeDo a:visited {
   color:#216300;
}

#ftr {
  position:relative;
  background: #ccc bottom center;
  background-repeat: no-repeat;
  width:1020px;
  height:55px;
  padding:10px;
  font: 12px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#fff;
  margin-left:auto; 
  margin-right:auto;
  text-align:center;

}

#ftr a {
  position:relative;
  margin-left:2em;
  top:2.5em;
  text-decoration:none;
  color:#fff;
}

#contactMatthew {
  position:relative;
  display:inline;
  float:left;
  text-align:left;
}

#contactJeff {
  position:relative;
  display:inline;
  float:left;
  text-align:left;
  top:2em;

}

#contactSteve {
  position:relative;
  display:inline;
  float:left;
  text-align:left;
  left:9em;
    top:2em;
}

#contactMichael {
  position:relative;
  display:inline;
  float:right;
  text-align:left;
  left:2em;
    top:2em;
}

#contactInfo {
  text-align:center;
  width:625px;
  margin-top:1.5em;
}

#gallery img {
 border:1px solid #000;
 margin-right:.5em;
}

#copyright {
  font: 10px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666666;

}

#copyright a {
  font: 10px Helvetica Neue, Free Sans, Lucida Grande, Arial, Helvetica, Verdana, sans-serif;
  color:#666666;
  text-decoration:none;
}

.gallery-content {
  position:relative;
  float:left;
  display:block;
  width:495px;
 }
 
.gallery-images {
  position:relative;
  width:132px;
  float:right;
  display:block;
  }
  
.tab-content {
  padding:2em;
}
  
  
ul.thumbs {
	
	margin: 0;
	padding: 0;
}
ul.thumbs li {

	float: left;
	padding: 0;
	margin: 5px 10px 5px 0;
	list-style: none;
}
a.thumb {

	padding: 2px;
	display: block;
	border: 1px solid #ccc;
	
}
ul.thumbs li.selected a.thumb {
	background: #000;
}
a.thumb:focus {
	outline: none;
}
ul.thumbs img {
	border: none;
	display: block;
	left:-5em;
}

#projects-content {
  position:relative;
  display:inline;
  float:left;
  width:734px;
  text-align:left;
  margin-top:1em;
}

/* CSS for navigation menu */


#menu{

  width:1026px;
  text-align:left;
  margin-left:-3em;
  margin-top:0em;
  position:absolute;
}
#nav{
  list-style: none; 
  z-index: 100;
  width:1026px;
  margin:0;

  
  }

#nav ul {
  padding: 0;
  margin:0;
  list-style: none;
  z-index:99;
  position:absolute;
  overflow:visible;	 
}

#nav li {
  margin:0;
  position: relative;
  float:left;
  border-top:none;
  border-bottom:none;
  border-left:none;
  display:block;
  height:auto;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  font-weight:bold;
  
}

#nav li:hover {

}



#nav ul li{ 
  border-left:solid 1px #CCC;
  border-right:solid 1px #CCC;
  border-top:none;
  border-bottom:none;
  border-width:1px 1px 1px 1px;
  top:1.6em;
  left:-0.2em;
  width:16em;
  text-align:left;
  font-weight:normal;
  height:auto;
  background-color:#fff;
  
}



#nav ul li:hover{ 
  color:#081853;
}

#nav ul li:last-child{ 
  border-bottom:solid 1px #081853;  
}


#nav ul ul li{ 
  border-width:px 1px 1px 1px;
}

#nav ul ul li:last-child{
  border-bottom:1px solid #081853;
}

#nav a {
  text-decoration:none;
  display:block;
  padding: 0.1em;
  margin:0.2em 0 0.2em 0.1em;
  height:1em;
  font-family: "Helvetica Neue", "Free Sans", "Lucida Grande", Arial, Helvetica, Verdana, sans-serif;
  color:#666;
}

#nav a:hover, #nav li:hover{
  color:#081853;

}

#nav ul li:hover, #nav ul li a:hover{

  color:#081853;
}

#nav ul{
  display:none;
}

/*all see this */
#nav ul ul{
  display:none;
  position:absolute;
  margin-top:-1.8em;
  margin-left:12em;
}

/* non-IE browsers see this */
#nav ul li>ul, #nav ul ul li>ul{
  margin-top:-1.4em;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li:hover ul ul ul ul ul{
  display:none;
}

#nav li:hover ul, #nav ul li:hover ul, #nav ul ul li:hover ul, #nav ul ul ul li:hover ul, #nav ul ul ul ul li:hover ul{
  display:block;
}

li>ul {
  top: auto;
  left: auto;
} 
