/* 	CSS Document */
/* 	TRELL
	Last updated on Oct 25, 2007
	Created & Updated by US
*/

/*======================================================================================================================
														BODY
========================================================================================================================*/

body
{
	padding: 0px;
	margin: 0px;
	text-align: center;
	background-color:#8689b4;
	/*background:url(../trell-images/backgound-pattern.jpg) repeat-x scroll left top #A2A7CD;*/
}


.main
{
	padding: 0px 0px 0px 55px;
	margin: 0px auto 0px auto;
	width: 720px;
	height: 830px;
	background-attachment: scroll;
	background-image: url(../trell-images/background-page-left.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	text-align: left;
}

.main-header
{
	padding: 0px;
	margin: 0px;
	float: left;
	width: 720px;
	height: 70px;
	background-color: #332F6A;	
}
.main-header-title
{
	width: 593px;
	padding: 18px 20px 0px 0px;
	margin: 0px;
	text-align: right;
	height: 52px;
	float: left;
}
.main-header-right
{
	padding: 54px 0px 0px 17px;
	margin: 0px;
	float: left;
	background-attachment: scroll;
	background-image: url(../trell-images/background-top-right-menu.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;	
	width: 90px;
	height: 16px;
}

/* 	===================================================================================================
										Content Area
===================================================================================================  */
.home
{
	width: 720px;
	height: 20px;
	float: left;
	margin: 0px;
	padding:0px;
	text-align:right;
	background:url(../trell-images/mail-icon.gif) no-repeat 611px 4px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 14px;
}

.home a
{
	padding: 0px 22px 0px 0px;
	margin: 0px;		
	text-align:right;
	color:#332f6a;
	text-decoration:none;
}

.home a:hover
{
	color:#ffffff;
	text-decoration:underline;
}


.middle-area
{
	padding: 7px 0px 3px 0px;
	margin: 0px;
	float: left;
	width: 720px;
	height: 675px;
	background-attachment: scroll;
	background-image: url(../trell-images/background-page.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}
.middle-area-left
{
	width: 177px;
	padding: 0px;
	margin: 0px;
	float: left;
	height: 614px;	
}
.middle-area-left-logo
{
	width: 177px;
	padding: 0px;
	margin: 0px;
	float: left;
	height: 62px;
	background-attachment: scroll;
	background-image: url(../trell-images/gallery-top-img.gif);
	background-repeat: no-repeat;
	background-position: center center;
}
.middle-area-left-gallery
{
	width: 145px;
	padding: 26px 0px 0px 32px;
	margin: 0px;
	float: left;
	height: 54px;
}

.more-link-left
{
	width: 70px;
	float: left;
	text-align: left;
	padding: 8px 0px 0px 80px;
	margin: 0px 0px 0px 0px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	height: 16px;
}
.more-link-left a
{
	color: #028FFF;
	padding: 0px 0px 0px 15px;
	margin: 0px 0px 0px 0px;
	text-decoration: none;
	background-attachment: scroll;
	background-image: url(../trell-images/more-link-arrow-left.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}
.more-link-left a:hover
{
	color: #FFFFFF;
	padding: 0px 0px 0px 15px;
	margin: 0px;
	text-decoration: none;
}

.middle-area-right
{
	padding: 0px;
	margin: 0px;
	width: 543px;
	float: left;
}

.middle-area-right-menu
{
	height: 26px;
	width: 543px;
	padding: 20px 0px 0px 0px;
	margin: 0px;
	float: left;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 12px;
	color: #FFFFFF;
}

.middle-area-right-menu ul
{
	height: 26px;
	width: 522px;
	padding: 0px 0px 0px 11px;
	margin: 0px;
	float: left;
	list-style: none;
}
.middle-area-right-menu li
{
	height: 26px;
	padding: 0px 6px 0px 8px;
	margin: 0px;
	float: left;
	width: auto;
}

.middle-area-right-menu li a
{
	font-family: "Trebuchet MS", Verdana, Tahoma;
	color: #FFFFFF;
	text-decoration: none;
	padding: 0px;
	margin: 0px;
	float: left;
}	
.middle-area-right-menu li a:hover
{
	font-family: "Trebuchet MS", Verdana, Tahoma;
	color: #7DC9FF;
	text-decoration: none;
}
.middle-area-right-active
{
	font-family: "Trebuchet MS", Verdana, Tahoma;
	color: #7DC9FF;
	text-decoration: none;
}	

.middle-area-right h1
{
	padding: 12px 0px 0px 15px;
	margin: 0px;
	width: 528px;
	float: left; 
	height: 23px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 15px;
	font-weight: normal;
	color: #FFFFFF;
}

.middle-area-right h2
{
	padding: 0px 0px 0px 0px;
	margin: 0px;
	height: 23px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 15px;
	font-weight: normal;
	color: #FFFFFF;
}


.flash-img-area
{
	height: 285px;
	width: 516px;
	padding: 10px 0px 0px 27px;
	margin: 0px;
	float: left;	
}

.content-area
{
	padding: 17px 0px 0px 27px;
	margin: 0px;
	float: left;
	width: 516px;
	height: 197px;
}
.content-area-left
{
	padding: 0px 0px 0px 0px;
	margin: 0px;
	float: left;
	width: 249px;
	height: 197px;
	background-attachment: scroll;
	background-image: url(../trell-images/middle-strip.gif);
	background-repeat: no-repeat;
	background-position: right top;	
}
.content-area-left p
{
	padding: 17px 8px 0px 0px;
	margin: 0px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	color: #FFFFFF;
}
.content-area-left-img
{
	margin: 0px;
	float: left;
	padding: 17px 6px 5px 0px;
}
.more-link
{
	width: 36px;
	height: 12px;
	float: right;
	text-align: right;
	padding: 0px 23px 0px 15px;
	margin: 0px;
	background-attachment: scroll;
	background-image: url(../trell-images/more-link-arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	
}
.more-link a
{
	color: #028FFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	padding: 0px;
	margin: 0px;
	float: left;
	text-decoration: none;
}
.more-link a:hover
{
	color: #FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	padding: 0px;
	margin: 0px;
	float: left;
	text-decoration: none;
}

.content-area-right
{
	padding: 0px 23px 0px 29px;
	margin: 0px;
	float: left;
	width: 214px;
/*	height: 198px;*/
}

ul.listitem
{
	padding: 19px 0px 0px 0px;
	margin: 0px;
	float: left;
	list-style: none;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 13px;
	width: 213px;
}
ul.listitem li
{
	padding: 0px 0px 14px 15px;
	margin: 0px;
	background-attachment: scroll;
	background-image: url(../trell-images/list-arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;	
	color: #FFFFFF;
	text-decoration: none;
}
ul.listitem li a
{
	padding: 0px;
	margin: 0px;
	background-attachment: scroll;
	color: #FFFFFF;
	text-decoration: none;
}

ul.listitem li a:hover
{
	padding: 0px;
	margin: 0px;
	color: #028FFF;
	text-decoration: none;
}

ul.client
{
	padding: 4px 0px 0px 14px;
	margin: 0px;
	float: left;
	list-style: none;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 12px;
	width: 213px;
}
ul.client li
{
	padding: 0px 0px 2px 15px;
	margin: 0px;
	background-attachment: scroll;
	background-image: url(../trell-images/list-arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;	
	color: #FFFFFF;
	text-decoration: none;
}
ul.client li a
{
	padding: 0px;
	margin: 0px;
	background-attachment: scroll;
	color: #FFFFFF;
	text-decoration: none;
}

ul.client li a:hover
{
	padding: 0px;
	margin: 0px;
	color: #028FFF;
	text-decoration: none;
}

/* 	===================================================================================================
										Footer Area
===================================================================================================  */

.inner-content-area
{
	padding: 0px 0px 0px 27px;
	margin: 0px;
	float: left;
	width: 516px;
	height: 214px;
}
.inner-content-title-img
{
	padding: 0px 0px 10px 0px;
	margin: 0px;
	float: left;
	height: 23px;
}

.inner-content
{
	padding: 0px 20px 0px 0px;
	padding: 0px;
	margin: 0px;
	float: left;
	width: 486px;
	height: 171px;
}
.inner-content-txt
{
	padding: 0px;
	margin: 0px;
	float: left;
	width: 486px;
	overflow: auto;
	height: 171px;
	position:absolute;
}

.inner-content-txt p
{
	padding: 0px 0px 5px 0px;
	margin: 0px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	color: #FFFFFF;
	line-height: 18px;
}
.inner-container
{
	padding: 10px 15px 0px 15px;
	margin: 0px;
	float: left;
	width: 512px;
	color:#FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
}

.inner-container p
{
	padding: 8px 0px;
	margin:0px;
}

ul.innerlistitem
{
	padding:0px 0px 0px 10px;
	margin:0px;
	list-style:none;
	float:left;
}
ul.innerlistitem li
{
	padding: 3px 0px 3px 18px;
	margin: 0px;
	background:url(../trell-images/list-arrow.gif) no-repeat left top;
}

.inner-container-left
{
	padding: 0px 20px 0px 0px;
	margin: 0px;
	float: left;
	width: 236px;
}

.inner-container-right
{
	padding: 0px 20px 0px 0px;
	margin: 0px;
	float: left;
	width: 236px;
}

.inner-content-scroll
{
	padding: 10px 5px 1px 5px;
	margin: 0px;
	float: left;
	width: 522px;
	overflow:auto;
	height:450px;
	background-color:#332f6a;
	color:#FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 12px;
	font-weight:bold;
	text-align:center;
	text-decoration:underline;
}
.inner-content-scroll-indust
{
	padding: 10px 5px 1px 5px;
	margin: 0px;
	float: left;
	width: 522px;
	overflow:auto;
	height:450px;
	background-color:#332f6a;
	color:#FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 12px;
	font-weight:bold;
	text-align:center;
	text-decoration:underline;
}

.inner-container-title
{
	color:#FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 12px;
	font-weight:bold;
	text-decoration:underline;
	float: left;
	width:490px;
	margin:10px 0px 5px 0px;
}

.ground-works-scroll
{
	float: left;
	width: 512px;
	overflow: auto;
	height:500px;
}
.ground-works-container
{
	color:#FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	float: left;
	width: 490px;
	padding:5px 0px 5px 0px;
}
.ground-works-container p
{
	margin:0px;
	padding:0px;
}

.ground-works-container img
{
	margin:0px 10px 10px 0px;
	padding:2px;
	border:1px solid #4b4c8f;
}

.text-blue
{
	color:#7dc9ff;
}

.inner-container a
{
	color:#7dc9ff;
	text-decoration: none;
}
.inner-container a:hover
{
	color:#7dc9ff;
	text-decoration: underline;
}
/* 	===================================================================================================
										Footer Area
===================================================================================================  */
.footer
{
	padding: 20px 0px 0px 0px;
	margin: 0px;
	float: left;
	width: 720px;
	height: 54px;
	background-color:#332F6A;
	text-align: center;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	font-size: 11px;
	color: #FFFFFF;
}

.footer a
{
	color: #FFFFFF;
	text-decoration:none;
}

.footer a:hover
{
	color: #FFFFFF;
	text-decoration: underline;
}


ul.footerlink
{	
	padding: 0px;
	margin: 0px;
	list-style: none;
	color: #FFFFFF;	
	width: 720px;
	float: left;
}
ul.footerlink li
{	
	list-style-position:inside;
	list-style-type:none;
	margin:0px;
	padding:0px;
	display: inline;
}

ul.footerlink li a
{	
	padding: 0px;
	margin: 0px;
	color: #FFFFFF;	
	text-decoration: none;
}

ul.footerlink li a:hover
{	
	padding: 0px;
	margin: 0px;
	color: #028FFF;
}


/* 	===================================================================================================
											 NAVIGATION (MENUS)  TOP Right Side
===================================================================================================  */

#top-right
{
	width:71px;
	height: 16px;
	padding:0px;
	margin:0px;
	float: left;
	background-attachment: scroll;
	background-image: url(../trell-images/background-right-menu.jpg);
	background-repeat: no-repeat;
	background-position: left top;		
}

#top-right ul
{
	position: relative;
	width:71px;
	height:16px;
	background-image: url(../trell-images/background-right-menu.jpg);
	margin: 0;
	padding: 0;
}

#top-right ul li
{
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top:0;
}

#top-rights ul li, #top-right a
{
	display:block;
	height:16px;
	border-bottom:0;
}

#top-right ul li a
{
	text-indent:-9999px;
	text-decoration:none;
	padding: 0px;
}

#tr1
{
	left:0; top:0; width:21px;
}
#tr2
{
	left:21px; top:0; width:31px;
}
#tr3
{
	left:52px; top:0; width:19px;
}

#tr1 a:hover 
{
	background: transparent url(../trell-images/background-right-menu.jpg) 0 -16px no-repeat; border-bottom:0;
}
#tr2 a:hover 
{
	background: transparent url(../trell-images/background-right-menu.jpg) -21px -16px no-repeat; border-bottom:0;
}
#tr3 a:hover 
{
	background: transparent url(../trell-images/background-right-menu.jpg) -52px -16px no-repeat; border-bottom:0;
}

/* 	===================================================================================================
											 NAVIGATION (MENUS)  Left Side - Photo Gallery
===================================================================================================  */


#menus
{
	width:145px;
	height: 448px;
	padding:0px 0px 0px 32px;
	margin:0px;
	float: left;
}

#menus ul{
	position: relative;
	width:124px;
	height:447px;
	background: url(../trell-images/background-left-menu.jpg) top left no-repeat;
	margin: 0;
	padding: 0;
}

#menus ul li{
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
}

#menus ul li, #menus a{
	display:block;
	border-bottom:0;
	height:149px;
}

#menus ul li a{
	text-indent:-999999px;
	text-decoration:none;
}

#m1{
	left:0px; top:0px;  width:124px;
}
#m2{
	left:0px; top:149px; width:124px;
}
#m3{
	left:0px; top:298px; width:124px;
}


#m1 a:hover {
	background:  transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px 0px;  border-bottom:0;
}
#m2 a:hover {
	background: transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px -149px; border-bottom:0;
}
#m3 a:hover {
	background: transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px -298px; border-bottom:0;
}


#m1a {
	left:0px; top:0px; width:124px; background: transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px 0px; border-bottom:0;
}
#m2a {
	left:0px; top:149px; width:124px; background: transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px -149px; border-bottom:0;
}
#m3a {
	left:0px; top:298px; width:124px; background: transparent url(../trell-images/background-left-menu.jpg) no-repeat -124px -298px; border-bottom:0;
}


.category-container
{
	width:490px;
	float:left;
	padding:0px 0px 0px 0px;
	margin:10px 0px 0px 0px;
}

.category-img-container
{
	width:480px;
	float:left;
	padding:0px 0px 0px 0px;
	margin:0px;
}
.category-img-container-box
{
	width:420px;
	float:left;
	padding:0px 0px 5px 70px;
	margin:0px;
}

.category-heading
{
	width:478px;
	padding:0px 0px 5px 5px;
	margin:0px 0px 10px 0px;
	float:left;
	text-align:left;
	color:#FFFFFF;
	font-size:100%;
	border-bottom:1px solid #FFFFFF;
	font-family: "Trebuchet MS", Verdana, Tahoma;
}
.category-img
{
	border:#999F98 1px solid;
	width:144px;
	float:left;
	padding:2px;
	margin:3px 15px 3px 15px;
	text-align:center;
}

.previous
{
	width:40%;
	float:right;
	padding:0px 0px 5px 0px;
	margin:0px;
	color:#FFFFFF;
	font-size:100%;
	text-align:right;
}

.previous a
{
	color:#FFFFFF;
	text-decoration:none;
}

.previous a:hover
{
	color:#FFFFFF;
	text-decoration: underline;;
}
.photo-num
{
	width:30%;
	float:right;
	padding:0px 0px 5px 0px;
	margin:0px;
	font-size:100%;
	text-align:right;
}
.back
{
	width:30%;
	float:right;
	padding:0px 0px 5px 0px;
	margin:0px;
	font-size:100%;
	text-align:left;
}

.back a
{
	color:#FFFFFF;
	text-decoration:none;
}

.back a:hover
{
	color:#FFFFFF;
	text-decoration: underline;
}
.gallery-text
{
	
	width:470px;
	float:left;
	padding:10px 10px 10px 5px;
	margin:0px;
	color:#FFFFFF;
	font-size:110%;
	text-align:left;
	line-height:17px;
	font-family: "Trebuchet MS", Verdana, Tahoma;
	/*border:1px solid #CCCCCC;*/
}
.category-img-big
{
	border:#FFFFFF 1px solid;
	width:480px;
	float:left;
	padding:2px;
	margin:0px;
	text-align:center;
}
