﻿@charset "UTF-8";
/* CSS Document */
/* build for ######## by Mojo Media Group */
/* reset */
*									{ margin: 0; padding:0; }
body 								{ font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; position:relative }
p 									{ font-size:0.85em; color:#737373; line-height:20px; margin:0 0 15px 0 }
img, img a							{ outline: none; border: none; }

h1, .headtext, .headtext2						{ color:#eb932f; font-size:2.5em; text-shadow: 1px 1px 1px #000; }
.headtext, .headtext2							{ margin:25px 0 0 0; font-weight:bold}
.headtext2										{ margin:0; line-height:46px}
.lighter, .smallerlighter						{ font-weight:normal; margin:13px 0 10px; font-size:2em; color:#1F539E;text-shadow: 1px 1px 1px #000}
.smallerlighter								{ font-size:0.8em}

h4			{ padding:0 0 0 35px}

a			{ color:#ea942f; text-decoration:none}
a:hover		{ color:#1f539e; text-decoration:underline}
p a			{}

/*content design div + class*/

#header-wrap	{ width:100%; margin:0 0 5px 0; background:#FFF; }
#header			{ width:960px; margin:5px auto 0 ;}
#logo			{ float:left; margin: 10px 0 }
#phone			{ float:right; margin:38px 9px 0 0 }
#phone a		{font-size:2em; color:#ea942f; text-decoration:none; font-weight:bold; text-shadow: 1px 1px 1px #000;}
#phone ul li 		{margin:0px 0px 0px 50px; font-size:1.8em; font-weight:bold; color:#000; list-style:none;}

.grey			{ font-size:1.8em; color:#aeb2b4; margin:10px 0 10px 0; padding:0; font-weight:lighter; line-height:30px}
h2, .blue			{ font-size:2.25em; color:#1f539e; font-weight:100; line-height:35px; margin:0}
.dr				{ font-size:1.2em; color:#FFF; padding:10px 10px; }
.smallblue		{ font-weight:bold; color:#1f539e}
.contact2		{ font-size:1.1em; color:#1f539e; line-height:0; padding:15px 0 0 0 }

#bmwrap			{ width:100%; background:#1a1b1c; height:20px; clear:both;}
#bmtext-flash	{ margin:0 auto; width:960px}

#title			{ margin:20px 0 0 0}

#city-wrap		{ background:url(images/city.gif.png) 40% 0 repeat #1a1b1c; height:308px; border-bottom:1px solid #FFF; border-top:1px solid #FFF; margin:0; width:100% } 
#interface		{ width:960px; margin:0 auto; position:relative}

.news			{ margin:10px 0 0 0}
.news ul		{ margin:0px 0 0 0; }
.news li		{ padding:5px; background:url(images/li-arrow.jpg) no-repeat 4px 50% #edf3f5; border:1px solid #cacdcd; margin:0 0 5px 0; height:45px; list-style:none}
.news li a		{}
.news li a:hover	{ padding:5px; background:url(images/li-arrow2.jpg) no-repeat 4px 50% #edf3f5; border:1px solid #cacdcd; margin:0 0 5px 0; height:45px; list-style:none }	

#nav			{ width:159px; margin:0 ; float:left; overflow:hidden}
#nav ul		{ height:308px}
#nav li		{ list-style:none; }
#nav li a		{ background:url(images/tabs.jpg); display:block; height:55px; text-indent:-9999px;}

#nav .home a		{ height:55px; background-position:0 0}
#nav .home a:hover	{ height:55px; background-position:-159px 0}

#nav .hire a		{ height:54px; background-position:0 -55px}
#nav .hire a:hover	{ height:54px; background-position:-159px -55px}

#nav .sales a		{ height:55px; background-position:0 -109px}
#nav .sales a:hover{ height:55px; background-position:-159px -109px}

#nav .rates a		{ height:54px; background-position:0 144px}
#nav .rates a:hover{ height:54px; background-position:-159px 144px}

#nav .faq a		{ height:43px; background-position:0 90px}
#nav .faq a:hover	{ height:43px; background-position:-159px 90px}

#nav .contact a	{ height:49px; background-position:0 47px}
#nav
 .contact a:hover	{ height:49px; background-position:-159px 47px}

#flash		{ width:307px; height:292px; float:left; border-bottom:1px solid #000; border-top:1px solid #000; background:#FFF; padding:13px 4px 3px 17px; background:url(images/bgindex.jpg) #FFF no-repeat 0 0 }
#flash2		{ width:779px; height:292px; float:left; border-right:1px solid #000; border-bottom:1px solid #000; border-top:1px solid #000; background:#FFF; padding:13px 4px 1px 14px; background:url(images/bghire.jpg) #FFF no-repeat 0 0 }


 
#jquerybg		{ position:absolute; background:none !important; background:url(images/slidebg.jpg); z-index:21000; top:144px; left:506px; height:308px; width:471px;  }		

#jquery-box	{   background-color: #FFFFFF; 
    border: 1px solid #000000;
    float: left;
    height: 308px;
    width: 471px; overflow:hidden}

#contact-wrap		{ width:100%; background:url(images/check.gif) repeat; border-top:1px solid #FFF; float:left; margin:0 auto }
#contact			{ width:960px; margin:0 auto}
#inputs				{ float:left; width:355px; margin:10px 0 0 0px}

.input				{ width:350px; height:30px; border:solid 1px #ccc; background:#FFF; color:#343434; margin:3px 0; padding:0px 0 0 2px; line-height:30px }
.selector			{ width:356px; border:solid 1px #ccc; background:#FFF; color:#343434; margin:3px 0; padding:6px 0;} 
.selector2			{ width:256px; height:30px; border:solid 1px #ccc; background:#FFF; color:#343434; margin:3px 0; padding:6px 0 0 3px; }

#send			{ width:110px; float:right; margin:12px 0 0 0}
#send ul		{}
#send li		{ list-style:none;}
#send li a		{ background:url(images/send.png) no-repeat; display:block; height:145px; text-indent:-9999px}

.form-submit		{ width:110px; height:145px; text-indent:-9999px; display:block; background:url(images/send.png); background-position:0 -145px; border:none; cursor:pointer; margin:0}
.form-submit-hover 	{ width:110px; height:145px; text-indent:-9999px; display:block; background:url(images/send.png); background-position:0 0; border:none; cursor:pointer; margin:0 }


#send .one a		{ background-position:0 0}
#send .one a:hover	{ background-position:0 -145px}

#google			{ width:480px; float:left }
#google ul		{ }
#google	li		{ list-style:none; width:418px; }
#google li a	{ background:url(images/BtoB.gif) no-repeat; display:block; width:421px; text-indent:-9999px; height:171px }

#google .maps a			{ background-position:0px -171px}
#google .maps a:hover	{ background-position:0 0}

#small-form-wrap	{ width:473px; float:right}

#main			{ width:960px; margin:0 auto; clear:both; padding:20px 0 0 0; overflow:hidden}
#left			{ width:490px; float:left; margin:0 9px 0 0}
.toprow			{ border-top:1px solid #e5e7e7; padding:13px 0; margin-top:10px}
.row				{ padding:13px 0; border-top:1px solid #e5e7e7; border-bottom:1px solid #e5e7e7;}
.bottomrow			{ padding:13px 0; border-bottom:1px solid #e5e7e7}
.noborderrow		{ padding:13px 0}

#main ul		{ width:420px; margin:0 auto 5px; color:#737373; font-size:0.85em; list-style:none}
.pointone			{ background:url(images/one.jpg) no-repeat; padding:0 0 5px 35px}
.pointtwo			{ background:url(images/two.jpg) no-repeat; padding:0 0 5px 35px;}
.pointthree			{ background:url(images/three.jpg) no-repeat; padding:0 0 8px 35px;}

#right			{ width:421px; float:right; padding:0 5px 0 0px; margin:0 }
#findout		{ padding:10px 0 0 0}
#questions, #questions2			{ margin:0 0 0px 0; padding:5px; background:#eee}
#questions ul, #questions2 ul	{}
#questions li, #questions2 li	{ width:400px; list-style:none; padding:5px 5px; background:#edf3f5; margin:0 0 5px 0; border:1px solid #ddd; overflow:hidden }
#questions li a, #questions2 li a			{  background:url(images/li-arrow.jpg) no-repeat; display:block; text-decoration:none}

#questions ul li h4 a, #questions ul li h4 a:hover, #questions ul li p a, #questions ul li p a:hover	{ background:none; color:#ea942f}
#questions2 ul li h4 a, #questions2 ul li h4 a:hover, #questions2 ul li p a, #questions2 ul li p a:hover	{ background:none; color:#ea942f}
#questions ul li, #questions2 ul li 		{background:url(images/li-arrow.jpg) no-repeat 5px 5px; display:block; height:51px}
#questions ul li a:hover, #questions2 ul li a:hover 		{background:url(images/li-arrow2.jpg) no-repeat; display:block;}
#questions ul li p, #questions2 ul li p		{ padding:2px 0 0 35px; margin:0}
#questions ul li p a, #questions2 ul li p a	{ line-height:11px}	

.newstitle a				{ padding:0 0 0 35px; font-size:1.2em}
.faqtext					{font-size:0.75em; color:#737373; line-height:15px; margin:5px 0 0px 0; float:left}

#questions .one a, #questions2 .one a		{ margin-top:20px; background-position:0 0}
#questions .one a:hover, #questions2 .one a:hover	{ margin-top:20px; background-position:-466px 0px}

#questions .two a, #questions2 .two a		{ background-position:0px -65px}
#questions .two a:hover, #questions2 .two a:hover	{ background-position:-466px -65px}

#questions .three a, #questions2 .three a		{background-position:0 -130px}
#questions .three a:hover, #questions2 .three a:hover	{background-position:-466px -130px}

#updates		{ width:445px; margin:0 0 0px 0}
#updates ul	{}
#updates li	{ width:445px; list-style:none; padding:0 0 5px 0 }
#updates li a	{ background:url(images/news.jpg) no-repeat; display:block; width:466px; height:59px; text-indent:-9999px}

#updates .one a		{ margin-top:20px; background-position:0 0}
#updates .one a:hover	{ margin-top:20px; background-position:0px -124px}

#updates .two a		{ background-position:0px -65px}
#updates .two a:hover	{ background-position:0px -189px}

#rates			{ float:left; clear:both; width:155px; border:2px solid #000; margin:20px 0 0 0; background:#EB932F; height:256px}
#rates p		{ color:#000; padding:0 10px}

#calltoaction	{ width:420px; height:100px; margin:14px 0 30px 31px}
#calltoaction ul	{}
#calltoaction li	{ width:294px; height:87px}
#calltoaction li a	{ background:url(images/sprite4.png) no-repeat; display:block; width:394px; height:116px; text-indent:-9999px}

#calltoaction .second a		{ background-position:0 0}
#calltoaction .second a:hover	{ background-position:0px -117px}

.number		{ -moz-transform: rotate(90deg); padding:26px 0 0 34px; font-size:2em; margin:10px}
.number1	{ -moz-transform: rotate(90deg); padding:23px 0 0 29px; font-size:2em; margin:10px}
.spine		{ text-indent:-9999px}



/*Contact-Form*/

#wrapper		{ margin:0 auto; border:10px solid #FFF; float:right; width:781px; background:#D7D7D7}
.info			{ margin:10px auto; padding:5px; border:1px solid #000; width:750px; background:#aaa; clear:both}
.secure p		{ color:#000; font-size:.7em; margin:0; line-height:17px}
.column		 	{ width:290px; padding:0 0 0 26px; float:left; margin:0; border-right:solid 1px }
.columnr		 	{ width:400px; padding:0 0px 0 30px; float:left; margin:0}
.column ul		{ padding: 25px 0 0 25px}
.column li		{ list-style:none; background:url(images/square.jpg) no-repeat 0 50%; padding:0 0 0 15px; margin:0 0 10px 0}

.questions		{ color:#1f539e; padding:5px 0 0 0; clear:both; margin:0}
.field				{ font-size:0.8em; color:#1F539E}
.security			{ margin:5px 0 0 0; color:#1f539e}


.form-input, .code, #datepicker	{ width:250px; height:25px; border:solid 1px #FFF; background:#FFF; color:#343434; margin:3px 0; padding:0 0 0 3px}
#datepicker						{ width:150px}
.code		{ width:256px; margin: 5px 0 12px 0px; height:25px; float:left}
.text-area		{ width:253px; height:60px; margin:0; border:solid 1px #FFF;}

.rc-box			{ padding:25px 0px 15px 0; float:left}
.right-column	{ background:#AAA; float:left; padding:0px 6px 5px; width:143px }
.con-title, .more		{ font-size:.75em; color:#000; border-bottom:1px solid #FFF; margin:12px 0 4px 0;}
.more			{ border:none; margin:0}
.con-title		{ font-size:.85em; font-weight:bold; }
.map			{ width:400px; border:1px solid #000; float:right; margin:0 0 15px 0 }
.secure			{ clear:both; overflow:hidden; width:256px}
.inside			{ padding:0px; float:left; padding:0 0 0 2px; border:1px solid; margin:0 0 10px 0}
#captcha		{ padding:0; float:left; margin:10px 0}	

.contact-box	{ float:left; padding:8px 10px 0 19px; margin:0 0px 0 0;}
.button-box			{ width:781px; margin:0 auto; padding:10px 0 0 0; clear:both; background:#FFF}

.img1, .img2		{ float:right; margin:25px 2px 0 0; border:1px solid; height:120px; width:190px; background:#FFF}
.img2				{ margin:25px 14px 25px 0}

.tickredbox		{ width:960px; margin:0 auto; background:#fbdacd; height:120px; padding:0 0 0 25px}
.tickyellowbox	{ width:960px; margin:0 auto; background:#e9fcca; height:120px; padding:0 0 0 25px}

#widget			{ float:right; margin:0}


.send-enquiry				{ text-transform:uppercase; background:#000; font-family:Impact,Arial,Helvetica,sans-serif; font-size:1.2em; color:#EB932F; text-decoration:none; float:left; height:50px; width:261px; border:1px solid; margin-bottom:10px }
.send-enquiry-hover		{ text-transform:uppercase; background:#EB932F; font-family:Impact,Arial,Helvetica,sans-serif; font-size:1.2em; color:#EB932F; text-decoration:none; float:left; height:50px; width:261px; border:1px solid; color:#FFF}


.contacttick 							{ background-color:#e9fcca; border:1px solid #018938; padding:20px; margin:5px 15px }
.contacttickimage 						{ float:left; padding-right:15px; }
.contacttickgreenp 						{ margin:0; padding:0; color:#018938; }
.contactfail 							{ background-color:#fbdacd; border:1px solid #b02820; padding:20px; margin:5px 15px }
.contactfailimage 						{ float:left; padding-right:15px; }
.contactfailredp 						{ margin:0; padding:0; color:#b02820; }

#imagespace, #imagespaceb		{ width:420px; height:179px; margin-top:15px; border:1px solid #000}
#imagespace2	{ width:420px; height:317px; margin:15px 0 20px 0; border:1px solid #000}

/* footer */
#footer-wrap	{ width:100%; background:#000; clear:both; margin-top:15px; padding:15px 0 }
#footer			{ width:960px; margin:0 auto}

#footer ul		{ }
#footer	li		{ color:#FFF; list-style:none; display:inline}
#footer	li a	{}
#footer li a:hover	{}

.links			{ margin:0 0 5px 0}
.links li a		{ padding:0 10px 0 0; font-size:0.95em; color:#EB932F}
.mojo li a, .mojo li		{ font-size:0.75em; margin:5px 0 0 0; display:inline}
.mojo li li, .mojo li li a {font-size: 1em;}

.bottom-style		{ background:#000}
.bottom-style li	{ display:inline}
.bottom-style li a	{ color:#121212}
/*wordpress*/

#wp #main	{ background:#eee; padding:20px 0; border-left:1px solid; border-right:1px solid}
#wp #right	{ float:left; width:250px; margin:25px 0 0 0; border-bottom: 1px dashed #CCCCCC;}
#wp #left	{ width:500px; padding:0 10px; border-left: 1px dashed #CCCCCC; border-right: 1px dashed #CCCCCC;}
.nav-previous	{ float:left}
.nav-next		{ float:right}
.post			{ clear:both; margin:20px 0; padding:0px 0 20px; border-bottom:1px dashed #aaa; width:500px }
#wp #footer-wrap	{ margin-top:0}
#wp h2 a			{ color:#1F539E}
#wp h2 a:hover		{ color:#EA942F}
.entry-meta, .entry-utility			{ font-size:0.7em}	
#wp p				{ color:#000; font-size:0.9em; margin:15px 0 20px 0}
#comments		{ text-indent:-9999px}
.xoxo a			{ color:#000}
#nav-above a, #nav-below a	{ color:#000; text-decoration:underline; font-size:0.7em}
.widget-title		{ color:#1F539E}


/*slidedeck - jquery*/

#10ft		{ padding:20px 0 0 0}

/* Make HTML 5 elements display block-level for consistent styling */
 dl, dt, dd {  display: block; display:list-item !important } 


/*
Skin Name: SlideDeck Website Skin
Skin URI: http://www.slidedeck.com/
Description: The skin used at slidedeck.com
Version: 1.5
Author: digital-telepathy
Author URI: http://www.dtelepathy.com/
Tags: flexible, white, black, multi-color
*/

/*
 * The frame surrounding the SlideDeck.
 * 
 * Customize the width, height, padding and background to customize the area 
 * surrounding your SlideDeck.
 */
.skin-slidedeck {
 background: url("back.png") repeat scroll 0 0 #000000;
    border: 4px solid #999999;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    height: 308px !important; height:261px;
    margin: 10px;
    padding: 7px;
    position: relative; 
}

/*
 * The SlideDeck element itself.
 * 
 * Customize the width and height to increase or decrease the size of
 * your SlideDeck. 
 */
.skin-slidedeck dl.slidedeck {
    position: relative;
	width: 100%;
	 height: 308px !important; height:261px;
	margin: 0;
    padding: 0;
	  background-color: #fff; overflow:hidden
}

/*
 * The SlideDeck slide area.
 * 
 * You can specify a height for the slide area, but it is not required, width
 * will automatically be defined for the slide area and will vary depending on
 * how many slides you have in your SlideDeck.
 * 
 * To add space between a slide and the next slide's spine (slide title bar),
 * increase the border-right definition. To remove the space, just remove the
 * border definition.
 * 
 * SlideDeck slides are all given a unique class, so you can customize the
 * appearance of each slide individually by referencing a slide by its
 * numbered class name. For example:
 *    .slidedeck dd.slide_1
 *    .slidedeck dd.slide_2
 *    .slidedeck dd.slide_3
 *    etc...
 */
.skin-slidedeck dl.slidedeck > dd {
    position: relative;
	height: 294px;
	padding: 5px 15px;
    margin: 0;
	
	background: url('slides.png') bottom left #fff;   /* Note: you should position the background with pixel measurements in IE7 as it improperly calculates the height of the DD element when containing vertical slides */
    overflow: hidden;
}

/*
 * The SlideDeck spine (slide title bar).
 * 
 * SlideDeck spines are rotated, so you will need to swap your directions. To
 * change the width of the spine, you will need to modify the spine height.
 * You will also need to make sure that any background imagery used is rotated
 * horizontally.
 * 
 * Like slides, spines are also given a unique class allowing for custom
 * appearance for each spine. This follows a similar naming convention:
 *     .slidedeck dt.slide_1
 *     .slidedeck dt.slide_2
 *     .slidedeck dt.slide_3
 *     etc...
 */
.skin-slidedeck dl.slidedeck > dt {
    position: relative;
	cursor: pointer;
	height: 43px;
	line-height: 38px;
	font-size: .813em;
	font-weight: bold;
	font-family: "Futura Bold", Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	background: url('spines.png') top left #d7d7d7;
	color: #505050;
    margin: 0;
    padding: 0;
	 border-bottom: 1px solid #000000;
	 
	 
}

/*
 * The hovered state of a SlideDeck spine.
 */
.skin-slidedeck dl.slidedeck dt.spine:hover {
	 background-color: #000000;
    background-position: left center;
    color: #FFFFFF; 
}

/*
 * The active state of a SlideDeck spine.
 */
.skin-slidedeck dl.slidedeck dt.spine.active,
.skin-slidedeck dl.slidedeck dt.spine.active:hover {
 background-color: #000000;
    background-position: left bottom;
    color: #FFFFFF;
    cursor: default;
	
}

/*
 * The SlideDeck spine index labels.
 * 
 * This is to style the numbers (or letters if you have customized it so)
 * that appear at the bottom of each SlideDeck spine.
 */
.skin-slidedeck dl.slidedeck dt.spine .index {
	margin-bottom: 2px; background-image:url(images/zero-grey-grey.jpg); 
    font-size: 1.5em;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	color: #505050;
	 margin: 0 0 9px;background-position: 26px 7px; background-repeat:no-repeat
}
.skin-slidedeck dl.slidedeck dt.spine.active .index { margin-bottom: 0; }

/*
 * The hovered state of a SlideDeck spine index label.
 */
.skin-slidedeck dl.slidedeck dt.spine:hover .index { color: #EB932F; background-image:url(images/zero-orage-black.jpg) }

/*
 * The active state of a SlideDeck spine index label.
 */
.skin-slidedeck dl.slidedeck dt.spine.active .index { color: #ea942f; }

/*
 * The SlideDeck "active corner".
 * 
 * This is the small triangle that appears in the upper left of the active
 * slide. This can be made any size and positioned differently by modifying
 * the margin values. By default the left margin is inset to prevent any
 * gap from appearing as the SlideDeck animates.
 */
.skin-slidedeck dl.slidedeck .activeCorner {
	margin-left: -6px;
	/*background-image: url('corner.png');*/ background:url(images/corner.png) no-repeat 6px 0;
	width: 18px;
	height: 25px;
	
}

/*
 * The SlideDeck vertical slide style.
 * 
 * Veritcal slides will take over the entire content area of a horizontal slide
 * automatically. Padding will automatically be accommodated for. You can also
 * eliminate the padding definition to have your vertical slide content line
 * up flush against the containing slide content area edges.
 */
.skin-slidedeck dl.slidedeck dd.slide ul.slidesVertical > li {
    overflow: hidden;
    padding: 10px;
}

/*
 * The SlideDeck vertical slide navigation container.
 * 
 * This is the container for the vertical slide navigation. You can position
 * this anywhere you want within the containing slide's area. If you try to
 * position it outside of the slide area it will not appear.
 */
.skin-slidedeck dl.slidedeck ul.verticalSlideNav {
	height: 70px;
	width: 25px;
	background: none;
	position: relative;
	overflow: hidden;
	padding: 15px 0 0;
	margin: 0;
    top: 0;
	left: 100px;
	-webkit-transform: rotate(90deg);
	-webkit-transform-origin: -7px 0;
	-moz-transform: rotate(90deg);
	-moz-transform-origin: -7px 0;
	-o-transform: rotate(90deg);
	-o-transform-origin: -7px 0;
}

/*
 * The SlideDeck vertical slide navigation link containers.
 * 
 * This is the container for a navigation link in the vertical slide navigation
 * element. You can adjust the width and height of this element to accommodate
 * for a larger vertical navigation button.
 * 
 * To increase the space between vertical navigation links, increase the bottom
 * and/or top padding of this element.
 */
.skin-slidedeck dl.slidedeck ul.verticalSlideNav li {
	position: relative;
    width: 25px;
    height: 12px;
    line-height: 12px;
	padding: 0;
	margin: 0;
    overflow: hidden;
    float: left;
    clear: left;
}

/*
 * The SlideDeck vertical slide position indicator.
 * 
 * This is the element that slides behind the default navigation link list to
 * show which is the current vertical slide being viewed. This should be given
 * similar dimensions to the vertical slide navigation links.
 * 
 * NOTE: This element is not used in this skin, so it is hidden
 */
.skin-slidedeck dl.slidedeck dd.slide ul.verticalSlideNav li.arrow { display: none; }

/*
 * The SlideDeck veritcal slide navigation links.
 * 
 * These are the vertical slide navigation links. By default these are a small
 * square that uses a sprite background image replacement method to hide the
 * default text that is placed in the link ("Nav 1", "Nav 2", "Nav 3").
 * 
 * To change the appearance of the navigation elements, you will need to use a
 * background image replacement as the text for the links cannot be changed.
 * Each vertical slide navigation link is given a unique class so they can be
 * styled individually. For example:
 *     dl.slidedeck dd.slide ul.verticalSlideNav li a.nav_1
 *     dl.slidedeck dd.slide ul.verticalSlideNav li a.nav_2
 *     dl.slidedeck dd.slide ul.verticalSlideNav li a.nav_3
 *     etc....
 */
.skin-slidedeck dl.slidedeck ul.verticalSlideNav li a {
	position: relative;
	display: block;
	padding: 12px 0 0 0;
	margin: 0;
	width: 25px;
	height: 0;
	overflow: hidden;
    line-height: 12px;
	background: url('vertical-nav.png') 0 0 no-repeat;
}
/* Vertical slide navigation style for the currently active vertical slide navigation link */
.skin-slidedeck dl.slidedeck ul.verticalSlideNav li.active a {
    background-position: 0 -24px;
}
/* Vertical slide navigation link style when the parent horizontal slide is active */
.skin-slidedeck dl.slidedeck dt.active ul.verticalSlideNav li.active a {
	background-position: 0 -12px;
}

/*
 * The SlideDeck vertical slide navigation link hover state.
 */
dl.slidedeck dd.slide ul.verticalSlideNav li a:hover {
    opacity: 0.75;
    -moz-opacity: 0.75;
    -webkit-opacity: 0.75;
    -khtml-opacity: 0.75;
    -ms-filter: "Alpha(opacity=75)";
    filter: Alpha(opacity=75); 
}

/*slidedeck.ie*/

.skin-slidedeck {
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Color=#e5e5e5, direction=120, strength=5)";
    filter: progid:DXImageTransform.Microsoft.Shadow(Color=#e5e5e5, direction=120, strength=5);
}
.skin-slidedeck dl.slidedeck ul.verticalSlideNav {
    left: 40px;
    top: 6px;
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
.skin-slidedeck dl.slidedeck dt.active ul.verticalSlideNav { top: 6px; }
.skin-slidedeck dl.slidedeck dt.spine .index,
.skin-slidedeck dl.slidedeck ul.verticalSlideNav li a {

    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(color='#f6f6f6')";
    filter: progid:DXImageTransform.Microsoft.Chroma(color='#f6f6f6');
}
.skin-slidedeck dl.slidedeck dt.spine.active .index,
.skin-slidedeck dl.slidedeck dt.spine.active ul.verticalSlideNav li a {background-position: 24px 7px;margin: 0 0 9px;
    background-color: #000; background-image:url(images/zero-orage-black.jpg); background-repeat:no-repeat;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(color='#181818')";
    filter: progid:DXImageTransform.Microsoft.Chroma(color='#181818');
	
}
.index { float:left}
.ui-datepicker-trigger		{ padding:0 0 0 4px}





/*Datepicker*/


.ui-datepicker-title	{ background:#1A1B1C; width:155px; color:#FFF; padding:0 0 0 5px}
.ui-datepicker-calendar	{ border:1px solid #000; background:#FFF; color:#000}
#from 		{ width:211px; margin:0 15px 0 0}
#to			{ width:210px; margin:0 0 0 22px}

table {
	font-size: 1em;
}

/* Site
   -------------------------------- */

/* Layout
   -------------------------------- */

.layout-grid {
	width: 960px;
}

.layout-grid td {
	vertical-align: top;
}

.layout-grid td.left-nav {
	width: 140px;
}

.layout-grid td.normal {
	border-left: 1px solid #eee;
	padding: 20px 24px;
	font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
}

.layout-grid td.demos {
	background: url('/images/demos_bg.jpg') no-repeat;
	height: 337px;
	overflow: hidden;
}

/* Normal
   -------------------------------- */

.normal h3,
.normal h4 {
	margin: 0;
	font-weight: normal;
}

.normal h3 {
	padding: 0 0 9px;
	font-size: 1.8em;
}

.normal h4 {
	padding-bottom: 21px;
	border-bottom: 1px dashed #999;
	font-size: 1.2em;
	font-weight: bold;
}

.normal p {
	font-size: 1.2em;
}

/* Demos */

.demos-nav, .demos-nav dt, .demos-nav dd, .demos-nav ul, .demos-nav li {
	margin: 0;
	padding: 0
}

.demos-nav {
	float: left;
	width: 170px;
	font-size: 1.3em;
}

.demos-nav dt,
.demos-nav h4 {
	margin: 0;
	padding: 0;
	font: normal 1.1em "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
	color: #e87b10;
}

.demos-nav dt,
.demos-nav h4 {
	margin-top: 1.5em;
	margin-bottom: 0;
	padding-left: 8px;
	padding-bottom:5px;
	line-height: 1.2em;
	border-bottom: 1px solid #F4F4F4;
}

.demos-nav dd a,
.demos-nav li a {
	border-bottom: 1px solid #F4F4F4;
	display:block;
	padding: 4px 3px 4px 8px;
	font-size: 90%;
	text-decoration: none;
	color: #555 ;
	margin:2px 0;
	height:13px;
}

.demos-nav dd a:hover,
.demos-nav dd a:focus,
.demos-nav dd a:hover,
.demos-nav dd a:focus {
	background: #f3f3f3;
	color:#000;
	-moz-border-radius: 5px; -webkit-border-radius: 5px;
}
 .demos-nav dd a.selected {
	background: #555;
	color:#EB932F;
	-moz-border-radius: 5px; -webkit-border-radius: 5px;
}


/* new styles for demo pages, added by Filament 12.29.08
eventually we should convert the font sizes to ems -- using px for now to minimize style conflicts
*/

.normal h3.demo-header { font-size:2em; padding:0 0 5px; border-bottom:1px solid #eee; text-transform: capitalize; }
.normal h4.demo-subheader { font-size:0.625em; text-transform: uppercase; color:#999; padding:8px 0 3px; border:0; margin:0; }
.normal a:link,
.normal a:visited { color:#1b75bb; text-decoration:none; }
.normal a:hover,
.normal a:active { color:#0b559b; }

#demo-config { padding:20px 0 0; }

#demo-frame { float:left; width:540px; height:380px; border:1px solid #ddd; overflow: auto; position: relative; }
#demo-frame h3, #demo-frame h4 { padding: 0; font-weight: bold; font-size: 1em; }

#demo-config-menu { float:right; width:180px;  }
#demo-config-menu h4 { font-size:0.813em; color:#666; font-weight:normal; border:0; padding-left:18px; }

#demo-config-menu ul { list-style: none; padding: 0; margin: 0; }

#demo-config-menu li { font-size:0.75em; padding:0 0 0 10px; margin:3px 0; zoom: 1; }

#demo-config-menu li a:link,
#demo-config-menu li a:visited { display:block; padding:1px 8px 4px; border-bottom:1px dotted #b3b3b3; }
* html #demo-config-menu li a:link,
* html #demo-config-menu li a:visited { padding:1px 8px 2px; }
#demo-config-menu li a:hover,
#demo-config-menu li a:active { background-color:#f6f6f6; }

#demo-config-menu li.demo-config-on { background: url(images/demo-config-on-tile.gif) repeat-x left center; }

#demo-config-menu li.demo-config-on a:link,
#demo-config-menu li.demo-config-on a:visited,
#demo-config-menu li.demo-config-on a:hover,
#demo-config-menu li.demo-config-on a:active { background: url(images/demo-config-on.gif) no-repeat left; padding-left:18px; color:#fff; border:0; margin-left:-10px; margin-top: 0px; margin-bottom: 0px; }

#demo-source, #demo-notes {
	clear: both;
	padding: 20px 0 0;
	font-size: 1.3em;
}

#demo-notes { width:520px; color:#333; font-size: 1em; }
#demo-notes p code, .demo-description p code { padding: 0; font-weight: bold; }
#demo-source pre, #demo-source code { padding: 0; }
code, pre { padding:8px 0 8px 20px ; font-size: 1.2em; line-height:130%;  }

#demo-source a:link,
#demo-source a:visited,
#demo-source a:hover,
#demo-source a:active { font-size:0.75em; padding-left:13px; background-position: left center; background-repeat: no-repeat; }

#demo-source a.source-open:link,
#demo-source a.source-open:visited,
#demo-source a.source-open:hover,
#demo-source a.source-open:active { background-image: url(images/demo-spindown-open.gif); }

#demo-source a.source-closed:link,
#demo-source a.source-closed:visited,
#demo-source a.source-closed:hover,
#demo-source a.source-closed:active { background-image: url(images/demo-spindown-closed.gif); }

div.demo {
	padding:0;
}

div.demo h3.docs { clear:left; font-size:0.75em; font-weight:normal; padding:0 0 1em; margin:0; }

div.demo-description {
	clear:both;
	padding:12px;
	font-family: "Trebuchet MS", "Arial", "Helvetica", "Verdana", "sans-serif";
	font-size: 1.3em;
	line-height: 1.4em;
}

.ui-draggable, .ui-droppable {
	background-position: top left;
}

.left-nav .demos-nav {
	padding-right: 10px;
}

#demo-link { font-size:0.688em;  padding-top: 6px; clear: both; overflow: hidden; }
#demo-link a span.ui-icon { float:left; margin-right:3px; }

/* Component containers
----------------------------------*/
#widget-docs .ui-widget { font-family: Trebuchet MS,Verdana,Arial,sans-serif; font-size: 1em; }
#widget-docs .ui-widget input, #widget-docs .ui-widget select, #widget-docs .ui-widget textarea, #widget-docs .ui-widget button { font-family: Trebuchet MS,Verdana,Arial,sans-serif; font-size: 1em; }
#widget-docs .ui-widget-header { border: 1px solid #ffffff; background: #464646 url(images/464646_40x100_textures_01_flat_100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }
#widget-docs .ui-widget-header a { color: #ffffff; }
#widget-docs .ui-widget-content { border: 1px solid #ffffff; background: #ffffff url(images/ffffff_40x100_textures_01_flat_75.png) 50% 50% repeat-x; color: #222222; }
#widget-docs .ui-widget-content a { color: #222222; }

/* Interaction states
----------------------------------*/
#widget-docs .ui-state-default, #widget-docs .ui-widget-content #widget-docs .ui-state-default { border: 1px solid #666666; background: #555555 url(images/555555_40x100_textures_03_highlight_soft_75.png) 50% 50% repeat-x; font-weight: normal; color: #000000; outline: none; }
#widget-docs .ui-state-default a { color: #000000; text-decoration: none; outline: none; }
#widget-docs .ui-state-hover, #widget-docs .ui-widget-content #widget-docs .ui-state-hover, #widget-docs .ui-state-focus, #widget-docs .ui-widget-content #widget-docs .ui-state-focus { border: 1px solid #666666; background: #444444 url(images/444444_40x100_textures_03_highlight_soft_60.png) 50% 50% repeat-x; font-weight: normal; color: #000; outline: none; }
#widget-docs .ui-state-hover a { color: #000; text-decoration: none; outline: none; }
#widget-docs .ui-state-active, #widget-docs .ui-widget-content #widget-docs .ui-state-active { border: 1px solid #666666; background: #ffffff url(images/ffffff_40x100_textures_01_flat_65.png) 50% 50% repeat-x; font-weight: normal; color: #F6921E; outline: none; }
#widget-docs .ui-state-active a { color: #F6921E; outline: none; text-decoration: none; }

/* Interaction Cues
----------------------------------*/
#widget-docs .ui-state-highlight, #widget-docs .ui-widget-content #widget-docs .ui-state-highlight {border: 1px solid #fcefa1; background: #fbf9ee url(images/fbf9ee_40x100_textures_02_glass_55.png) 50% 50% repeat-x; color: #363636; }
#widget-docs .ui-state-error, #widget-docs .ui-widget-content #widget-docs .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec url(images/fef1ec_40x100_textures_05_inset_soft_95.png) 50% bottom repeat-x; color: #cd0a0a; }
#widget-docs .ui-state-error-text, #widget-docs .ui-widget-content #widget-docs .ui-state-error-text { color: #cd0a0a; }
#widget-docs .ui-state-disabled, #widget-docs .ui-widget-content #widget-docs .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
#widget-docs .ui-priority-primary, #widget-docs .ui-widget-content #widget-docs .ui-priority-primary { font-weight: bold; }
#widget-docs .ui-priority-secondary, #widget-docs .ui-widget-content #widget-docs .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }

/* Icons
----------------------------------*/

/* states and images */
#demo-frame-wrapper .ui-icon, #widget-docs .ui-icon { width: 16px; height: 16px; background-image: url(images/222222_256x240_icons_icons.png); }
#widget-docs .ui-widget-content .ui-icon {background-image: url(images/222222_256x240_icons_icons.png); }
#widget-docs .ui-widget-header .ui-icon {background-image: url(images/222222_256x240_icons_icons.png); }
#widget-docs .ui-state-default .ui-icon { background-image: url(images/888888_256x240_icons_icons.png); }
#widget-docs .ui-state-hover .ui-icon, #widget-docs .ui-state-focus .ui-icon {background-image: url(images/454545_256x240_icons_icons.png); }
#widget-docs .ui-state-active .ui-icon {background-image: url(images/454545_256x240_icons_icons.png); }
#widget-docs .ui-state-highlight .ui-icon {background-image: url(images/2e83ff_256x240_icons_icons.png); }
#widget-docs .ui-state-error .ui-icon, #widget-docs .ui-state-error-text .ui-icon {background-image: url(images/cd0a0a_256x240_icons_icons.png); }


/* Misc visuals
----------------------------------*/

/* Corner radius */
#widget-docs .ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; }
#widget-docs .ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
#widget-docs .ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
#widget-docs .ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
#widget-docs .ui-corner-top { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
#widget-docs .ui-corner-bottom { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
#widget-docs .ui-corner-right {  -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
#widget-docs .ui-corner-left { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
#widget-docs .ui-corner-all { -moz-border-radius: 4px; -webkit-border-radius: 4px; }

/* Overlays */
#widget-docs .ui-widget-overlay { background: #aaaaaa url(images/aaaaaa_40x100_textures_01_flat_0.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); }
#widget-docs .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa url(images/aaaaaa_40x100_textures_01_flat_0.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -webkit-border-radius: 8px; }

/*
----------------------------------*/

#widget-docs { margin:20px 0 0; border: none; }

#widget-docs h2, #widget-docs h3, #widget-docs h4, #widget-docs p, #widget-docs ul, #widget-docs code { margin:0; padding:0; }
#widget-docs code { display:block; color:#444; font-size:.9em; margin:0 0 1em; }
#widget-docs code strong { color:#000; }
#widget-docs p { margin:0 3em 1.2em 0; }
#widget-docs p.intro { font-size:0.813; color:#666; line-height:1.3; }
#widget-docs ul { list-style-type: none; }

#widget-docs h2 { font-size:1em; margin:1.2em 0 .5em; }
#widget-docs h3 { font-size:0.875em; color:#e6820E; margin:1.5em 0 .5em; }
.normal #widget-docs h4 { font-size:0.75em; color:#000; border:0; margin:0 0 .5em; }

#docs-overview-main { width:400px; }
#docs-overview-sidebar { float:right; width:200px; }
#docs-overview-sidebar a span { color:#666; }
#widget-docs #docs-overview-main p { margin-right:0; }
#widget-docs #docs-overview-sidebar h4 { padding-left:0; }

.docs-list-header { float:left; width:100%; margin:10px 0 0; border-bottom:1px solid #eee; }
#widget-docs .docs-list-header h2 { float:left; margin:0; }
#widget-docs .docs-list-header p { float:right; margin:5px 0; font-size:0.688em; }

.docs-list { float:left; width:100%; padding:0 0 10px; }
.docs-list .param-header { float:left; clear:left; width:100%; padding:8px 0; border-top:1px solid #eee; }
#widget-docs .param-header h3, #widget-docs .param-header p { margin:0; float:left; }
#widget-docs .param-header h3 { width:50%; }
#widget-docs .param-header h3 span { background: url(images/demo-spindown-closed.gif) no-repeat left; padding-left:13px; }
#widget-docs .param-open .param-header h3 span { background: url(images/demo-spindown-open.gif) no-repeat left; }
#widget-docs .param-header p { width:24%; }
#widget-docs .param-header p.param-type span { background: url(images/icon-docs-info.gif) no-repeat left; cursor:pointer; border-bottom:1px dashed #ccc; padding-left:15px; }

.param-details { padding-left:13px; }
.param-args { margin:0 0 1.5em; border-top:1px dotted #ccc;}
.param-args td { padding:3px 30px 3px 5px; border-bottom:1px dotted #ccc;  }


/* overrides for ui-tab styles */
#widget-docs ul.ui-tabs-nav { padding:0 0 0 8px; }
#widget-docs .ui-tabs-nav li { margin:5px 5px 0 0; }

#widget-docs .ui-tabs-nav li a:link,
#widget-docs .ui-tabs-nav li a:visited,
#widget-docs .ui-tabs-nav li a:hover,
#widget-docs .ui-tabs-nav li a:active { font-size:0.875em; padding:4px 1.2em 3px; color:#fff; }

#widget-docs .ui-tabs-nav li.ui-tabs-selected a:link,
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:visited,
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:hover,
#widget-docs .ui-tabs-nav li.ui-tabs-selected a:active { color:#e6820E; }

#widget-docs .ui-tabs-panel { padding:20px 9px; font-size:0.75em; line-height:1.4; color:#000; }

#widget-docs .ui-widget-content a:link,
#widget-docs .ui-widget-content a:visited { color:#1b75bb; text-decoration:none; }
#widget-docs .ui-widget-content a:hover,
#widget-docs .ui-widget-content a:active { color:#0b559b; }


<!--NEWSLIDER-->

.container {
	overflow: hidden;
	width: 900px;
	margin: 0 auto;
}
#rotator {
	padding: 10px;
	background: #f0f0f0;
	border: 1px solid #ccc; overflow:hidden; border:1px solid #000; padding:12px 0px 16px 16px; height:280px; width:455px !important; width:445px;
}
a {color: #fff;}

/*--Main Image Preview--*/
.main_image {
	width: 280px; height: 280px;
	float: left;
	background: #333;
	position: relative;
	overflow: hidden;
	color: #fff;
}
.main_image h2 {
	font-size: 2em;
	font-weight: normal;
	margin: 0;	padding: 10px;
}
.main_image p {
	font-size: 1.2em;
	padding:0px;	margin: 0;
	line-height: 1.6em;
}
.block small { 
	padding:0px; 
	background: url(icon_calendar.gif) no-repeat 0 center; 
	font-size: 0.8em; 
}
.main_image .block small {margin-left: 10px;}
.main_image .desc{
	position: absolute;
	bottom: 0;	left: 0;
	width: 100%;
	display: none;
}
.main_image .block{
	width: 100%;
	background: #111;
	border-top: 1px solid #000;
}
.main_image a.collapse {
	background: url(btn_collapse.gif) no-repeat left top;
	height: 27px; width: 93px;
	text-indent: -99999px;
	position: absolute; 
	top: -27px; right: 20px; 
}
.main_image a.show {background-position: left bottom;} 


.image_thumb { float:right;
	float: left !important;
	width: 150px;
	background: #f0f0f0;
	border-right: 1px solid #fff;
	border-top: 1px solid #ccc;
}
.image_thumb img {
	border: 1px solid #ccc; 
	padding: 5px; 
	background: #fff; 
	float: left;
}
.image_thumb ul {
	margin: 0; padding: 0;
	list-style: none;
}
.image_thumb ul li{
	margin: 0; padding: 12px 0px 10px 0;
	background: #f0f0f0 url(nav_a.gif) repeat-x;
	width: 149px;
	float: left;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-right: 1px solid #ccc;
}
.image_thumb ul li.hover {
	background: #ddd;
	cursor: pointer;
}
.image_thumb ul li.active {
	background: #fff;
	cursor: default;
}
html .image_thumb ul li h2 {
	font-size: 1.5em; 
	margin: 5px 0; padding: 0;
}
.image_thumb ul li .block {
	float: right; 
	padding: 0;
	width:139px
	
}	
.image_thumb ul li p{display: none;}
#rotator h2		{ line-height:20px}

.demo a	{ color:#EB932F}

a		{ color:#737373; text-decoration:underline}