/*****************************************************************************************
/ Filename: styles.css
/ Author: Design Fuse
/ Purpose: evolutioniron.ca - additional styles 
/ Date: 08.03.12
/*****************************************************************************************/ 

/* Helper Styles */ 
.clearboth { clear:both; }


/* Start FIR Method: http://www.tjkdesign.com/articles/tip.asp */ 
h1 
{
	position:relative;
}

h1 a 
{
	z-index:1;	
	position:absolute;
	top:0;
	left:0;
	
	width: 630px; 
	height: 130px;
	
	min-height:130px;
	background:transparent url(/images/layout/background/header_bkg.png) no-repeat;
	font-size:1em;
	
	/* DEBUG 
	border-bottom: 1px solid yellow; */ 
	
}

h2
{
	position:relative;
	
	/* To add space after the title */
	margin-bottom: 18px;
}

h2 a 
{
	z-index:2;	
	position:absolute;
	top:0;
	left:0;
	
	width: 630px; 
	height: 45px;
	
	min-height:45px;
	/* background:transparent url(/images/layout/h2/welcome.png) no-repeat; */
	font-size:1em;
	
	/* DEBUG 
	border-bottom: 1px solid yellow; */ 
}

a.h2_welcome { background:transparent url(/images/layout/h2/welcome.png) no-repeat; } 
a.h2_projects { background:transparent url(/images/layout/h2/projects.png) no-repeat; } 
a.h2_projects_railings { background:transparent url(/images/layout/h2/projects_railings.png) no-repeat; } 
a.h2_projects_gates { background:transparent url(/images/layout/h2/projects_gates.png) no-repeat; } 
a.h2_projects_gardens { background:transparent url(/images/layout/h2/projects_gardens.png) no-repeat; } 
a.h2_projects_wine_cellar_doors { background:transparent url(/images/layout/h2/projects_wine_cellar_doors.png) no-repeat; } 
a.h2_iron_art { background:transparent url(/images/layout/h2/iron_art.png) no-repeat; } 
a.h2_paintings { background:transparent url(/images/layout/h2/paintings.png) no-repeat; } 
a.h2_interior_design { background:transparent url(/images/layout/h2/interior_design.png) no-repeat; } 
a.h2_contact_us { background:transparent url(/images/layout/h2/contact_us.png) no-repeat; } 
a.h2_about_us { background:transparent url(/images/layout/h2/about_us.png) no-repeat; } 

/* End FIR Method: */ 

/* Start nav menu styles */

div.nav_menu
{ 
	

}

div.nav_menu ul
{
	text-align: center;
  	
	
  /*
	list-style: none;
	margin-left: auto;
	margin-right: auto; */ 
}

div.nav_menu ul li
{
	display: inline;

/*	float:left;
	border-right: 1px solid #ccc;
	padding: 0px 5px 0px 5px;  */
}

div.nav_menu ul li a 
{
	width:auto;
  
  padding:4px 10px;
  
	color: #ccc; 
	text-decoration:none;
/*	display: block; */

}

div.nav_menu ul li a.selected
{
	font-weight: bold;
}


div.nav_menu ul li a:hover
{
	color: #eee; text-decoration: underline;
	
}

/* End nav menu styles */

/* Start Gallery styles 
   Note: Gallery refers to the six images in the main content area 
   Code: http://dnevnikeklektika.com/en/css-gallery-layout-en
   		 used with modifications 
 */ 
 
a img{ border:none; } /* A small fix */


 
div.gallery
{ 
	margin: 10px 0px 10px 0px; 
	font-family:"Times New Roman", Times, serif;
	text-align: center;
	color:#666666;
} 
 
div.row 
{
	margin: 0;
	padding: 0; 
	width: 98.5%;
}

div.cols3, 
div.cols2
{
	float: left; 
	border: 1px solid #ccc; 
	background-color:#CCCCCC;
	padding: 0px 0px 0px 0px;
	/* by putting in 1px padding-top you can remove the downward motion of the image hovers */ 
}

div.cols3 {  width: 190px;  margin: 0px 7px 13px 7px; }
*html div.cols3 { margin: 0px 6px 13px 6px; }

div.cols2 { width:250px; margin: 0px 7px 13px 7px; /* margin: 0px 30px 13px 80px; */ }
*html div.cols2 { margin: 0px 0px 13px 22px; }


div.cols3 a,
div.cols3 a:link,
div.cols3 a:visited,
div.cols3 a:focus,
div.cols3 a:hover,
div.cols3 a:active,
div.cols2 a,
div.cols2 a:link,
div.cols2 a:visited,
div.cols2 a:focus,
div.cols2 a:hover,
div.cols2 a:active
{ 	display: block;
	padding: 1px 0px 3px 0px;
	text-decoration: none;
	font-size: 105%; 
	color:#333; font-weight: bold; font-family: Georgia, "Times New Roman", Times, serif;
	background-image:url(/images/layout/background/col3_col2_bkg.png); background-repeat:repeat-x;
} 


div.cols3 a:hover,
div.cols2 a:hover
{
	background-image:url(/images/layout/background/col3_col2_hover_bkg.png); background-repeat:repeat-x; 
	color: #CCC;
}

div.cols3 a.home_about_us:hover { background-image:url(/images/gallery/home/about_us_hover.jpg); background-repeat:no-repeat; } 
div.cols3 a.home_projects:hover { background-image:url(/images/gallery/home/projects_hover.jpg); background-repeat:no-repeat; } 
div.cols3 a.home_iron_art:hover { background-image:url(/images/gallery/home/iron_art_hover.jpg); background-repeat:no-repeat; } 
div.cols3 a.home_paintings:hover { background-image:url(/images/gallery/home/paintings_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.home_interior_design:hover {background-image:url(/images/gallery/home/interior_design_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.home_contact_us:hover { background-image:url(/images/gallery/home/contact_us_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_gates:hover { background-image:url(/images/gallery/projects/main/gates_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_railings:hover { background-image:url(/images/gallery/projects/main/railing_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_gardens:hover { background-image:url(/images/gallery/projects/main/gardens_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_wine_cellar_doors:hover { background-image:url(/images/gallery/projects/main/wine_cellar_doors_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_furnishings:hover { background-image:url(/images/gallery/projects/main/furnishings_hover.jpg); background-repeat:no-repeat; }
div.cols3 a.projects_various_works:hover { background-image:url(/images/gallery/projects/main/various_hover.jpg); background-repeat:no-repeat; }

div.cols3 a.image,
div.cols3 a.image:link,
div.cols3 a.image:visited,
div.cols3 a.image:focus,
div.cols3 a.image:hover,
div.cols3 a.image:active
{
	width: 190px;
	height: 150px;
	
	filter:alpha(opacity=85); 
	-moz-opacity: 0.85; 
	opacity: 0.85;
}


div.cols3 a.image:hover
{
	filter:alpha(opacity=100);   
	-moz-opacity: 1.0;   
	opacity: 1.0;

}

div#panes
{
	width: 630px;

}

/* End Gallery styles */ 

/* Start Gallery Text styles */ 

div.gallery_text { 
 	margin: 5px 0px 5px 0px;
	font-size: 80%;
 	clear:both;
	text-align: center;
	color:#CCCCCC; font-family:Tahoma;
}

/* End Gallery Text styles */ 


/* Start Gallery Controller styles */

#gallery_control 
{
	display: block;
	text-align: center;
	margin-bottom: 1em;
}

#gallery_control * 
{
	display: inline;
	padding: 4px;
	user-select: none;
	cursor: pointer;
	vertical-align: middle;
}
	
#gallery_control li
{
	cursor: pointer;
	display: inline;
	color: #CCC;
	
/*	float:left;
	border-right: 1px solid #ccc; */
	padding: 2px 5px 2px 5px;  
	
	border: 1px solid #CCC; 
	background-color:#111;
}

*html #gallery_control ul li 
{
	margin: 0px 0px 0px 10px;
}

		
#gallery_control li.active 
{
	background-color: #333333; 
	font-weight: bold;
}
			
#previous { float: none; cursor: pointer; }
#next { float: none; cursor: pointer; }




div.gallery_control ul li.active
{
	font-weight: bold;
	color:#FFF;
}


div.gallery_control ul li:hover
{
	color: #eee; text-decoration: none;
	
}

/* End Gallery Controller styles */

/* Start Main Content Box Used In About Us Page */ 
div.main_content_box
{
	border: 1px solid #666;
	padding: 14px; 
	background-image: url(/images/layout/background/main_content_box_bkg.png);
	background-position: top;
	background-repeat:repeat-x;
	float: left;
	
}

*html div.main_content_box { padding: 14px; } 

div.grey_content_box { 
	
	background: #DFDFDF;

}


/* End Main Content Box Used In About Us Page */ 



/* Start Custom Slider Styles */ 
#content1 
{ margin-top: 5px;
	height: 245px;
	width: 580px;
	float:left;
	background: #DFDFDF;
	overflow:hidden;
}

#content1 p,
div.main_content_box p
{ font-size: 80%;
	margin: 13px;
}

div.main_content_box p a:link,
div.main_content_box p a:visited,
#content1 p a:link,
#content1 p a:visited
{
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}

div.main_content_box p a:hover,
#content1 p a:hover
{
	color:#333333;
	text-decoration: underline;
}


.scrollbar-vert
{
	margin-top: 5px;
	background-color: #999999;
	height: 245px;
	width: 20px;
	float:left;
}

.handle-vert{
	height: 42px;
	width: 20px; cursor:pointer;
	background:url(/images/layout/background/evo_iron_handle.gif) no-repeat;
}

/* End Custom Slider Styles */