/* ----------------------------------------------------------------------------------------------------------
  Copyright Mearns & Gill - Write your own code sucka!
---------------------------------------------------------------------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------
  Colour Guide
---------------------------------------------------------------------------------------------------------- */

/*
Body Text Grey: #757575;
Border Grey: #B8B8B8;
Light Red: #E70f47;
*/

/* ----------------------------------------------------------------------------------------------------------
 Active Page Styles
---------------------------------------------------------------------------------------------------------- */

body#home ul li a#nav-home{background:url(../images/nav/nav-bg.png) 0px -100px no-repeat;}
body#about ul li a#nav-about{background:url(../images/nav/nav-bg.png) -85px -100px no-repeat;}
body#products ul li a#nav-products{background:url(../images/nav/nav-bg.png) -165px -100px no-repeat;}
body#operations ul li a#nav-operations{background:url(../images/nav/nav-bg.png) -272px -100px no-repeat;}
body#people ul li a#nav-people{background:url(../images/nav/nav-bg.png) -464px -100px no-repeat;}
body#careers ul li a#nav-careers{background:url(../images/nav/nav-bg.png) -549px -100px no-repeat;}
body#contact ul li a#nav-contact{background:url(../images/nav/nav-bg.png) -645px -100px no-repeat;}

body#news1 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news1 ul li a#nav-news1{color:#E70f47;}

body#news2 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news2 ul li a#nav-news2{color:#E70f47;}

body#news3 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news3 ul li a#nav-news3{color:#E70f47;}

body#news4 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news4 ul li a#nav-news4{color:#E70f47;}

body#news5 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news5 ul li a#nav-news5{color:#E70f47;}

body#news6 ul li a#nav-news{background:url(../images/nav/nav-bg.png) -393px -100px no-repeat;}
body#news6 ul li a#nav-news6{color:#E70f47;}

body#people #main-col .anythingSlider .wrapper {border-right:0px solid #b8b8b8;}

/* ----------------------------------------------------------------------------------------------------------
 Blank Template styles
----------------------------------------------------------------------------------------------------------*/

#desc-text{
	height:68px;
	text-align:right;
	color:#FFFFFF;
	padding: 132px 0 0 0;
	vertical-align: bottom;
}

#desc-text h1{
	color:#E70f47;
}

.white-text{text-align:left; color:#FFFFFF;}

.super {
	height: 0;
	line-height: 1;
	vertical-align:text-top;
	_vertical-align: top;
	position: relative;
	font-size:95%;
}

/* ----------------------------------------------------------------------------------------------------------
 Main Navigation
----------------------------------------------------------------------------------------------------------*/

#nav-wrapper{
            height: 53px;
}

#nav{
            width:960px;
            height:50px;
            margin:0;
            padding:0;
            background-image: url(../images/nav/nav-bg.png);
            background-repeat: no-repeat;
            border-bottom: 3px solid #E70f47;
}

#nav li, #nav a {
			height:50px;
			display:block;
			padding:0;
			margin:0;
}

#nav li {
            float:left;
            list-style:none;
            display:inline;
            text-indent:-9999px;
}

#nav1 {width: 85px;}
#nav2 {width: 80px;}
#nav3 {width: 107px;}
#nav4 {width: 121px;}
#nav5 {width: 71px;}
#nav6 {width: 85px;}
#nav7 {width: 96px;}
#nav8 {width: 94px;}

#nav1 a:hover {background:url(../images/nav/nav-bg.png) 0px -50px no-repeat; }
#nav2 a:hover {background:url(../images/nav/nav-bg.png) -85px -50px no-repeat; }
#nav3 a:hover {background:url(../images/nav/nav-bg.png) -165px -50px no-repeat; }
#nav4 a:hover {background:url(../images/nav/nav-bg.png) -272px -50px no-repeat; }
#nav5 a:hover {background:url(../images/nav/nav-bg.png) -393px -50px no-repeat; }
#nav6 a:hover {background:url(../images/nav/nav-bg.png) -464px -50px no-repeat; }
#nav7 a:hover {background:url(../images/nav/nav-bg.png) -549px -50px no-repeat; }
#nav8 a:hover {background:url(../images/nav/nav-bg.png) -645px -50px no-repeat; }

html {
  height: 100%;
  overflow-y: scroll;
}

/* not all browsers set white as the default background color 
 * color is set to create not too much contrast with the background color
 * line-height is to ensure that text is legible enough (that there is enough space between the upper and lower line) 
 */         

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  height: 100%;
  background: #000;
  color: #5D5D5D;
  line-height: 18px;
}

/* ----------------------------------------------------------------------------------------------------------
  Main Divs
---------------------------------------------------------------------------------------------------------- */

#container {
            width: 100%;
            height: 100%;
            text-align: center;/* IE fix to center the page */
            background-image:url(../images/page/fade-bg-02.jpg);
            background-repeat: no-repeat;
            background-position: center top;
}

#wrapper {
            width: 960px;
            margin: 0 auto;/* center the page in Firefox*/
            text-align: left;
}

#main{}

div#product-wrapper{padding:0 10px 0 10px;}
.product-item{padding:0 10px 0 10px; width:335px; float:left;}
.product-item h3{padding:0; margin:5px 0 20px 0}
.product-item img{ border: 2px solid #999999;}

div#main-wrapper {
            width: 900px;
            border-left: 0px solid #d3d3d3;
            border-right: 0px solid #d3d3d3;
            float:left;
            padding:0 30px 30px 30px;
            background:#FFFFFF;
}

div#main-wrapper-internal {
            width: 960px;
            border-left: 0px solid #d3d3d3;
            border-right: 0px solid #d3d3d3;
            float:left;
            padding:0 0 30px 0;
            background-color: #FFFFFF;
            background-image: url(../images/page/internal-sidebar-bg.jpg);
            background-repeat: repeat-y;
            background-position: left top;
}

#feat-content{ margin-top:20px}
#feat-content h3,h4{margin:10px 0 5px 0}
#feat-content p{font-size:11px; line-height:16px; margin:0}

.feat-box img {border: 2px solid #b8b8b8;}
.feat-box:hover img {border: 2px solid #E70f47;}

#feat-content .left-right{ /*background:#00FFFF;*/ width:280px; float:left;}
#feat-content .middle{ /*background:#009900;*/width:280px; float:left; margin:0 30px 0 30px;}

#feat-boxes {margin:50px auto;width:960px;}
#feat-boxes div {
	margin-right:15px;
	float:left;
	width:280px;
	height:160px;
	border:0px solid #999;
	position:relative;
	overflow:hidden;
}
#feat-boxes img {position:absolute;}
#sml-feat-boxes {margin:20px 0 20px 20px;}
#sml-feat-boxes div {
	margin-right:15px;
	float:left;
	width:220px;
	height:150px;
	border:0px solid #999;
	position:relative;
	overflow:hidden;
}
#sml-feat-boxes img {position:absolute;}
#long-feat-boxes {margin:20px 0 20px 20px;}
#long-feat-boxes div {
	margin-right:15px;
	float:left;
	width:220px;
	height:150px;
	border:0px solid #999;
	position:relative;
	overflow:hidden;
}
#long-feat-boxes img {position:absolute;}
.clear-box {overflow:auto;}
.corner{position: relative;right: 0;bottom: 0;}

#product-boxes{margin:20px 0 0 12px; height:170px}
#product-boxes img{border-bottom:0px;}
.product-box{width:216px; height:146px; float:left; margin:0 7px 0 8px;}
.product-box {border: 2px solid #b8b8b8;}
.product-box:hover {border: 2px solid #E70f47;}


/* ----------------------------------------------------------------------------------------------------------
  Header
---------------------------------------------------------------------------------------------------------- */

#header{}

.logo-fc{
            position:absolute;
            z-index:99;
            float:left;
            margin-top:29px;
}

.logo-sc{
            float:left;
            margin-top:0px;
}


#google-search{position:relative; top:15px; float:right; margin:0px 10px 0 0; padding:0}

/*#cse-search-box{float:right; margin:0 10px 0 0; padding:0; width:200px; overflow:visible;}
#cse-search-box #search-box{
            height:18px;
            font-size: 12px;
            margin:0;
            padding:3px;
}*/

#cse-search-box #search-box{
            border:none;
            font-size:12px;
            padding:2px;
} 

#cse-search-box #search-btn{
            height: 24px;
            width: 50px;
            background-image: url(../images/page/search-btn.gif);
            background-repeat: no-repeat;
            text-indent:-9999px;
            cursor:pointer;
            border:0;
            overflow:visible;
            background-position: right top;
}

/* ----------------------------------------------------------------------------------------------------------
 Side Cols
----------------------------------------------------------------------------------------------------------*/

div#main-col{
            float:right;
            width: 730px;
}

div#main-col-text{
            margin:0 20px 0px 20px;
}

div#main-col-text ul{ margin-bottom:20px;}
div#main-col-text ul ul{margin-left:10px;}

div#main-col-text ol{ margin-bottom:20px;}
div#main-col-text ol ol{margin-left:10px;}

div#main-col-text ul li
{
            padding: 2px 0 2px 20px;
            background-image: url(../images/bullet.gif);
            background-repeat: no-repeat;
            background-position: 0 0.3em;
            line-height:18px;
            font-size:12px;
            list-style:none;
            border: 0px solid #000;
            margin:4px 0 4px 14px;
}

div#main-col-text ol li
{
            padding: 2px 0 2px 10px;
            line-height:14px;
            font-size:12px;
            list-style-type: decimal;
            list-style-position:inside;
            margin:4px 0 4px 10px;
}

div#main-col-text img{
            padding: 8px;
            border: 1px solid #b8b8b8;
            background-color:#e4e4e4;
            float: right;
            margin: 0 0 10px 10px;
}

.people{}

#bread {
            color: #757575;
            padding: 3px;
            font-size:11px;
            margin: 20px 0 0 20px;
}

#bread a:link{text-decoration:none;color:#757575;}
#bread a:visited{text-decoration:none;color:#757575;}
#bread a:hover{text-decoration:underline;color:#E70f47;}
#bread a:active{text-decoration:none;color:#757575;}

#bread ul {
            margin-left: 0;
            padding-left: 0;
            display: inline;
            border: none;
} 

#bread ul li {
            margin-left: 0;
            padding-left: 2px;
            border: none;
            list-style: none;
            display: inline;
}

.link-header{
	color:#E70f47;
	font-size:16px;
	font-weight:bold;
}

.link-header span{
	font-size:12px;
	font-weight:normal;
}


/*div#main-col-text ul a:link{font-size:10px; text-decoration:none;color:#757575;}
div#main-col-text ul a:visited{font-size:10px; text-decoration:none;color:#757575;}
div#main-col-text ul a:hover{font-size:10px; text-decoration:underline;color:#E70f47;}
div#main-col-text ul a:active{font-size:10px; text-decoration:none;color:#757575;}

div#main-col-text li{
            display:inline;
            font-size:10px;
            text-transform:capitalize;
            list-style-type: disc;
}*/

div#main-col-text h1{
            margin:10px 0 0 0;
}


#local-reps{float:right; width:340px; border:0px solid #D9D9D9; display:block; margin-top:45px;}
.switch{ float:right; padding-right:120px;font-size:11px;}

#local-reps h2 {text-decoration:none; margin:0 0 0 0;font-size:16px;color:#000000;}
.plus{font-size:12px; font-family:Arial, Helvetica, sans-serif; position:relative;top:-2px;}

#local-reps span a:link{font-size:16px; font-family: 'StainlessLight', Arial, Helvetica, sans-serif; position:relative; top:2px; clear:both; color:#E70f47;}
#local-reps span a:visited{color:#E70f47;}
#local-reps span a:hover{color:#000000;}
#local-reps span a:active{color:#E70f47;}

#local-reps p { margin:5px 0 0 0;}

/* ----------------------------------------------------------------------------------------------------------
 Sub/Page Navigation
----------------------------------------------------------------------------------------------------------*/

#sub-nav{
            height:48px;
            border-bottom: 1px solid #757575;
            margin:0 20px 30px 20px;
}

#sub-nav ul{ margin:0;}
#sub-nav ul li {color:#757575;}
#sub-nav a {
    		display:block;
			/*color:#757575;*/
            text-decoration:none;
            margin: 0 4px 0 4px;
            padding: 4px 5px 4px 5px;
            background-color:#FFFFFF;
            font-size:12px;
            letter-spacing:normal;
            line-height:20px;
}

/*#sub-nav a:visited{color:#757575;} */
#sub-nav a:hover {color:#E70f47;}
#active{
	border-top: 1px solid #757575;
	border-left: 1px solid #757575;
	border-right: 1px solid #757575;
	font-weight:bold;
	color:#E70f47;
} /*page nav left margin*/

#sub-nav li {
            float:left;
            list-style:none;
            display:inline;
            padding: 0 ;
}


a:link {color:#757575}      
a:visited {color:#757575}  
a:hover {color:#E70f47}  
a:active {color:#757575}  


/* ----------------------------------------------------------------------------------------------------------
 Footer
----------------------------------------------------------------------------------------------------------*/

div#main-footer {
            color:#757575;
            clear:both;
            width: 960px;
            margin: 0 0 20px 0;
            height:91px;
            background-image: url(../images/page/footer-bg.png);
            background-repeat: no-repeat;
            background-position: center top;
            font-size:11px;
}

 

#footer-links{ float:left}
#footer-accred{ float:right}
#footer-accred img{ margin:10px 30px 0 0;}

#footer-links ul{margin:25px 0 0 30px;}

#footer-links li{
            list-style:none;
            display:inline;
}

#footer-links p{
            font-size:11px;
            margin:0 0 0 30px;
}

#footer-links a:link {color:#757575;text-decoration:none; padding:2px;}
#footer-links a:visited {color:#757575;text-decoration: none;padding:2px;}
#footer-links a:hover {color:#FFFFFF; background-color:#E70f47; text-decoration: none;padding:2px;}
#footer-links a:active {outline: none;padding:2px;}


/* ----------------------------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------------------------*/


/* this choice of font-family is supposed to render text the same across platforms
 * letter-spacing makes the font a bit more legible
 */

body, input, button, textarea, select {
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: .05em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'StainlessLight', Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  color:#000000;
  line-height:26px;
}

h7 {
  font-family: 'StainlessLight', Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  font-size: 12px; 
}


h1, h2, h3, h4, h5, h6, a:link{color:#E70F47;text-decoration:none;}
h1, h2, h3, h4, h5, h6, a:visited{color:#E70F47;text-decoration:none;}
h1, h2, h3, h4, h5, h6, a:hover{color:#000000;text-decoration:none;}
h1, h2, h3, h4, h5, h6, a:active{color:#E70F47;text-decoration:none;}

pre, tt, code, kbd, samp, var {
  font-family: Arial, Helvetica, sans-serif;
}

/* These should be self explanatory
 */

h1 {font-size: 22px; color:#000000;}
h2 {font-size: 20px; color:#E70F47;}
h3 {font-size: 18px; color:#E70F47;}
h4 {font-size: 16px; color:#E70F47;}
h5 {font-size: 14px; color:#E70F47;}
h6 {font-size: 12px; color:#E70F47;}
 

/*h1 {font-size: 1.5em;}
h2 {font-size: 1.4em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.2em;}
h5 {font-size: 1.1em;}
h6 {font-size: 1em;}*/

h1, h2, h3, h4, h5, h6 {font-weight: normal;}

 

/* styling for links and visited links as well as for links in a hovered, focus and active state 
 * make sure to keep these rules in that order, with :active being last
 * text-decoration: none is to make the links more legible while they are in a hovered, focus or active state
 * a:focus and :focus are used to help keyboard users, you may change their styling, but make sure to give users a visual clue of the element's state.
 * outline:none used with the pseudo-class :active is to avoid the sticky outline when a user clicks on a link, but choose to not follow it
 * note that the last rule does not do anything in IE as this browser does not support "outline" (besides, it treats :active and :focus the same)
 */ 

p a:link {color: #E70f47; text-decoration:underline; padding:2px;}
p a:visited {color: #E70f47;text-decoration: underline;padding:2px;}
p a:hover { color:#FFFFFF; background-color:#E70f47; text-decoration: none;padding:2px;}
p a:focus {text-decoration: none;}
p a:focus,:focus {outline: 0px dotted #000;}
p a:active {outline: none;padding:2px;}

/* margin and padding values are reset for all these elements
 * you could remove from there elements you do not used in your documents, but I don't think it'd worth it 
 */

body, p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, blockquote, th, td {
  margin: 0;
  padding: 0;
}

 

/* this is to prevent border from showing around fieldsets and images (i.e., images inside anchors)
 */
fieldset, img {
  border: 0;
}

/* to prevent a gap from showing below images in some browsers 
 */
 
img {vertical-align: bottom;}

/* Styling of list items
 * This styles sheet contains a class to apply on lists to reset list-type and margin on LIs
 */

ol li,
ul ol li {list-style-type: decimal;}
ul li {list-style-type: disc;}
ul ul li {list-style-type: circle;}
ul ul ul li {list-style-type: square;}
ol ol li {list-style-type: lower-alpha;}
ol ol ol li {list-style-type: lower-roman;}

/* These should be self explanatory
 * I believe *most* UAs style sub and sup like this by default so I am not sure there is value to include these rules here
 */

sub {
  vertical-align: sub;
  font-size: smaller;
}

sup {
  vertical-align: super;
  font-size: smaller;
}


/* color is to make that element stands out (see color set via body)
 * padding is used so Internet Explorer does not cut-off descenders in letters like p, g, etc.)
 */

legend {
  color: #000;
  padding-bottom: .5em; 
}

/* according to Eric Meyer's reset: tables still need 'cellspacing="0"' in the markup
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}


/* caption and summary are very important for tabular data but because caption is nearly impossible to style across browsers many authors do not use it or use display:none to "hide" it (which is almost the same as not using it).

 * so to prevent such workaround, I am positioning this element off-screen
 */

caption {
  position: absolute;
  left: -999em;
}

 

/* all th should be centered unless they are in tbody (table body)
 */

th {text-align: center;} 
tbody th {text-align: left;} 

/* See Eric Meyer's article about Fixed Monospace Sizing 
 * http://meyerweb.com/eric/thoughts/2010/02/12/fixed-monospace-sizing/
 */

code {color: #06f;}
code, pre {font-family: "Courier New", monospace, serif; font-size: 1em;}

/* This should be self explanatory
 */

blockquote, q, em, cite, dfn, i, cite, var, address {
  font-style: italic;
}

 

/* to prevent some browsers from inserting quotes on "q" and "p" ("p" in blockquotes)
 */

blockquote p:before, blockquote p:after, q:before, q:after {content: '';}

/* These should be self explanatory
 */

th, strong, dt, b {
  font-weight: bold;
}

ins {
  text-decoration: none;
  border-bottom: 3px double #333;
}

del {text-decoration: line-through;} 

abbr, acronym {
  border-bottom: 1px dotted #333;
  font-variant: normal;
} 


/* Creating white space (vertical gutters) via padding
 * most authors do not set right/left padding or margin on these elements, they rather use an extra wrapper or style the container with padding to create the left and right gap/gutter they need
 * I find that the latter creates less robust layouts because it leads authors to mix padding with width which creates issue with the broken box model (IE5 or IE6 in quirks mode) 
 * so imho, setting this style using the child combinator (i.e., div > h1) should be the best way to do it, but unfortunately IE 6 does not support such syntax, so I have to go with the following + a reset (see next rule)  
 */

#wrapper h1, h2, h3, h4, h5, h6, p, pre, ul, ol, dl, fieldset, address {padding:0 0;}
#main-col h1{ margin-left:20px;}

p{margin-bottom: 20px;}

/* this is to reset the left/right gaps (created by the previous and next rules) on nested elements
 */

#wrapper dd p, dd pre, dd ul, dd ol, dd dl, li p, li pre, li ul, li ol, li dl, fieldset p, fieldset ul, fieldset ol {
  padding-right: 0;
  padding-left: 0;
}

 

/* These should be self explanatory
 */

dd {
  padding-left: 20px;
  margin-top: .5em;
}

/*#wrapper li {margin-left:30px;}*/

/* we cannot use padding on a table to create left and right gaps (as we do with the elements above), instead we use margin */ 
/*table {
  margin-right: 30px;
  margin-left: 30px;
} */

/* we use margin for hr for the same reason we do for table 

 */

hr {
  margin-right: 30px;
  margin-left: 30px;
  border-style: inset;
  border-width: 1px;
}

/* top margin solution */
/* this is my approach to create white space between elements, you do not have to adhere to it
 * rather than stylling these elements with top and bottom margin, or simply bottom margin I only use top margin
 */

h1, h2, h3, h4, h5, h6, p, pre, dt, li, hr, legend, button, textarea, select, address {margin-top: 20px;}

/* top padding solution */
/* this is a different approach which may be less frustrating for novice because it avoids running into collapsing margin and allows to clear floats while preserving space above the element
 * if you decide to give this a try, then comment out the above rule and uncomment the two next ones
 */
 /* 
 h1, h2, h3, h4, h5, h6, p, pre, dt, dd, li, legend, address {padding-top: 1.2em;}
 hr, input, button, textarea, select, table {margin-top: 1.2em;}
 */

/* form elements
 * this should not affect the layout of the labels unless you style them in a way that padding applies
 * if I include this here it is mostly because when labels are styled with float and clear, top padding creates a gap between labels (bottom margin would, but not top margin)
 */

label {padding-top: 1.2em;}

/* line height helps to set the vertical alignment of radio buttons and check boxes (remember to group these in fieldsets) 
 */

fieldset {line-height: 1;}

/* vertical alignment of checkboxes (a different value is served to IE 7)
 */

input[type="checkbox"] {
  vertical-align: bottom; 
  *vertical-align: baseline;
}

/* vertical alignment of radio buttons
 */

input[type="radio"] {vertical-align: text-bottom;}

/* vertical alignment of input fields for IE 6
 */
input {_vertical-align: text-bottom;}

/* a specific font-size is set for these elements
 */

input, button, textarea, select, optgroup, option {
  font-size: 12px;
}

/* this is to fix IE 6 and 7 which create extra right/left padding on buttons
 * IMPORTANT: because IE 6 does not understand the first selector below, you need to apply the class "inputButton" to all input of type="button" in your documents
 * the first declaration is for IE 6 and 7, the second one for IE 6 only, the third one is for all browsers.
 */

button,
input[type="submit"],
input[type="reset"],
input[type="button"],
.inputButton {
  *overflow: visible;
  _width: 0;
  padding: .2em .4em;

}

/* classes
 * to style elements with the default padding and margin we set on headings, paragraphs, lists, etc.
 * for example, this class could be used on a DIV inside a blockquote or a DIV inside a FORM, etc.
 */

.block {
  padding: 0 30px;
  margin-top: 1.2em;
}

/* to swap padding for margin
 * for example, this class could be used on a heading you'd style with a bottom border
 */

.padding2margin {
  margin-right: 30px;
  margin-left: 30px;
  padding-right: 0;
  padding-left: 0;
}

/* list items are styled by default with markers (disc, etc.) and left margin
 * if you apply the class "noMarker" to a list, its items won't display markers and won't have left margin
 */

.noMarker li {
  list-style: none;
  margin-left: 0;
}

/* ----------------------------------------------------------------------------------------------------------
  Sliding Login Panel
---------------------------------------------------------------------------------------------------------- */

/*

Name: Sliding Login Panel with jQuery 1.3.2
Author: Jeremie Tisseau
Author URI: http://web-kreation.com/
Date: March 26, 2009
Version: 1.0
            Copyright 2009 Jeremie Tisseau
            "Sliding Login Panel with jQuery 1.3.2" is distributed under the GNU General Public License version 3:
            http://www.gnu.org/licenses/gpl-3.0.html

*/

/***** clearfix *****/

.clear {clear: both;height: 0;line-height: 0; background:#00FF00;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* Panel Tab/button */
.tab {
    background: url(../images/tab_b_fade.png) repeat-x 0 0;
    height: 29px;
    position: relative;
    top: 0;
    z-index: 999;
}

 

.tab ul.login {
            display: block;
            position: relative;
            float: right;
            clear: right;
            height: 25px;
            width: auto;
            font-weight: bold;
            line-height: 29px;
            margin: 0;
            right: 100px;
            color: white;
            font-size: 10px;
            text-align: center;
            font-style:normal;
}

.tab ul.login li.left {
            background: url(../images/tab_l.png) no-repeat left 0;
            height: 29px;
            width: 10px;
            padding: 0;
            margin: 0;
            display: block;
            float: left;
}

.tab ul.login li.right {
            background: url(../images/tab_r.png) no-repeat left 0;
            height: 29px;
            width: 10px;
            padding: 0;
            margin: 0;
            display: block;
            float: left;
}

.tab ul.login li {
            text-align: left;
            padding: 0 6px;
            display: block;
            float: left;
            height: 29px;
            background: url(../images/tab_m.png) repeat-x 0 0;
            margin-top: 0;
}

.tab ul.login li a {color: #FFF;}
.tab ul.login li a:hover {color: #000;}
.tab .sep {color:#414141}
.tab a.open, .tab a.close {
            font-size:11px;
            height: 20px;
            line-height: 20px !important;
            padding-left: 25px !important;
            cursor: pointer;
            display: block;
            width: 120px;
            position: relative;
            top: 5px;
            letter-spacing:normal;
            text-decoration:none;
}

.tab a.open {background: url(../images/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(../images/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(../images/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(../images/bt_close.png) no-repeat left -19px;}

/* sliding panel */

#toppanel {
    position: absolute;   /*Panel will overlap  content */
    /*position: relative;*/   /*Panel will "push" the content down */
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

 

#panel {
            width: 100%;
            height: 220px;
            color: #FFF;
            background: #E70f47;
            overflow: hidden;
            position: relative;
            z-index: 3;
            display: none;
}

#panel h2 {
            font-size: 32px;
            padding: 10px 0 20px 0;
            margin: 0;
            color: #FFFFFF;
}

#panel h3{
            font-size: 20px;
            padding: 0px 0 0px 0;
            margin: 0;
            color: #000000;
}

#panel h4{font-size: 20px;padding: 0px 0 10px 0;margin: 0;color: #000000;}
#panel h5{padding: 10px 0 0 0;margin: 0 0 0 0;}

#panel h5 a:link {color:#FFFFFF;}      
#panel h5 a:visited {color:#FFFFFF;}  
#panel h5 a:hover {color:#000000;}  
#panel h5 a:active {color:#FFFFFF;}  

#panel p {font-size: 12px;margin: 5px 0;padding: 0;}
#panel a:link {color: #FFF;text-decoration: underline;}
#panel a:visited {color: #FFF;text-decoration: underline;}
#panel a:hover {text-decoration: none; color:#000;text-decoration: none;}
#panel a:active {color: #FFF;outline: none;text-decoration: underline;}

#panel a-lost-pwd {
            display: block;
            float: left;
}

#panel .content {
            width: 960px;
            margin: 0 auto;
            padding-top: 29px;
            text-align: left;
            font-size: 0.85em;
}

#panel .content .left {
            width: 230px;
            float: left;
            padding: 0 30px 0 0;
            border-right: 0px solid #333;
}

 

#panel .content .middle {
            width: 370px;
            float: left;
            padding: 0 30px 0 0;
            border-right: 0px solid #333;
}

 

#panel .content .right {
            width: 250px;
            border-right: 0px solid #333;
}

 

#panel .content form {
            margin: 0 0 10px 0;
}

 

#panel .content label {
            float: left;
            padding-top: 8px;
            clear: both;
            width: 280px;
            display: block;
}

 

#panel .content .mc-field-group input.field {
            border: 2px #FFFFFF solid;
            background: #FFFFFF;
            margin-right: 5px;
            margin-top: 4px;
            width: 252px;
            color: #000000;
            height: 20px;
            padding:4px;
}

 

#panel .content .mc-field-group input:focus.field {
            border: 2px #760c20 solid;
}

 

/* BUTTONS */
/* Login and Register buttons */
#panel .content .mc-field-group input.bt_login,

#mc-embedded-subscribe {
            display: block;
            float: left;
            clear: left;
            height: 34px;
            text-align: center;
            cursor: pointer;
            border: none;
            font-weight: bold;
            margin: 10px 0;
}

#panel .content .mc-field-group input.bt_login {
            width: 74px;
            background: transparent url(../images/bt_login.png) no-repeat 0 0;
}

#mc-embedded-subscribe {
            width: 74px;
            color: white;
            background: url(../images/slider-submit.gif) no-repeat 0 0;
}

#panel .lost-pwd {
            display: block;
            float:left;
            clear: right;
            padding: 15px 5px 0;
            font-size: 0.95em;
            text-decoration: underline;
}

/* ----------------------------------------------------------------------------------------------------------
  Anything Slider
---------------------------------------------------------------------------------------------------------- */

 

/*
    anythingSlider v1.2

    By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/

*/

 
.anythingSlider                         { width: 960px; height: 400px; position: relative; margin: 0 auto; }
.anythingSlider .wrapper                { width: 960px; overflow: hidden; height: 400px; margin: 0 0; position: absolute; top: 0; left: 0; }


                                       /* Width below is max for Opera */

.anythingSlider .wrapper ul             { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; border-top: 0px solid #e0a213; border-bottom: 0px solid #e0a213; margin: 0; }
.anythingSlider ul li                   { display: block; float: left; padding: 0; height: 400px; width: 960px; margin: 0; }
.anythingSlider .arrow                  { /*display: none; */height: 400px; width: 40px; background: url(../images/arrows-new-02.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 0px; cursor: pointer; }
.anythingSlider .forward                { background-position: 0 0; right: -15px; border:0px solid #ffffff; }
.anythingSlider .back                   { background-position: -40px 0; left: -15px; border:0px solid #ffffff; }
.anythingSlider .forward:hover          { background-position: 0 -400px; }
.anythingSlider .back:hover             { background-position: -40px -400px; }

 

#thumbNav                               { position: relative; top: 340px; text-align: center; width:250px; margin: 0 auto; z-index:9999; height:20px; } /*increase the width here if you have an huge amount of objects in the slider*/

#thumbNav a                         {
            color:#FFFFFF;
            color: none;
            font: 10px Georgia, Serif;
            display: inline-block;
            /*padding: 2px 2px;*/
            height: 12px;
            width:12px;
            margin: 0 5px 0 0;
            text-indent:-9999px;
            text-align: center;
            overflow:hidden;

/*          -moz-border-radius-bottomleft: 5px;
            -moz-border-radius-bottomright: 5px;
            -webkit-border-bottom-right-radius: 5px;
            -webkit-border-bottom-left-radius: 5px;
            background-color: #c58b04;*/
            background-image: url(../images/feat-off.png);
            background-repeat: no-repeat;

}

#thumbNav a:hover                       { background-image: url(../images/feat-on.png);background-repeat: no-repeat;}
#thumbNav a.cur                         { background-image: url(../images/feat-on.png);background-repeat: no-repeat; }

 

#start-stop                             { display:none; background: green; background-image: url(../images/cellshade.png); background-repeat: repeat-x; color: white; padding: 2px 5px; width: 40px; text-align: center; position: absolute; right: 45px; top: 323px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#start-stop.playing                     { background-color: red; }
#start-stop:hover                       { background-image: none; }

/*

  Prevents

*/
.anythingSlider .wrapper ul ul          { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
.anythingSlider .wrapper ul ul li       { float: none; height: auto; width: auto; background: none; }
.anythingSlider .wrapper h3{ color:#FFFFFF;}

 

 

 

/* ----------------------------------------------------------------------------------------------------------
  Product Slider
---------------------------------------------------------------------------------------------------------- */

/*
    anythingSlider v1.2 By Chris Coyier: http://css-tricks.com with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/

*/

#main-col .anythingSlider                         { width: 730px; height: 351px; position: relative; margin: 0 auto; }
#main-col .anythingSlider img                     { border-bottom:1px solid #b8b8b8; padding: 0; margin: 0 }
#main-col .anythingSlider .wrapper                { width: 729px; overflow: hidden; height: 351px; margin: 0 0; position: absolute; top: 0; left: 0; border-right:1px solid #b8b8b8; }


                                       /* Width below is max for Opera */

#main-col .anythingSlider .wrapper ul             { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; border-top: 0px solid #e0a213; border-bottom: 0px solid #e0a213; margin: 0; }
#main-col .anythingSlider ul li                   { display: block; float: left; padding: 0; height: 350px; width: 730px; margin: 0; }
#main-col .anythingSlider .arrow                  { /*display: none; */height: 38px; width: 36px; background: url(../images/product-slider-arrows.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 0px; cursor: pointer; }
#main-col .anythingSlider .forward                { background-position: -38px 0; right: 20px; top: 313px; }
#main-col .anythingSlider .back                   { background-position: 0 0; left: 638px; top: 313px }
#main-col .anythingSlider .forward:hover          { background-position: -38px -38px; }
#main-col .anythingSlider .back:hover             { background-position: 0 -38px; }

#main-col #thumbNav                               { position: relative; top: 320px; text-align: center; width:250px; margin: 0 auto; z-index:9999; height:20px; } /*increase the width here if you have an huge amount of objects in the slider*/


/* ----------------------------------------------------------------------------------------------------------
  People Slider
---------------------------------------------------------------------------------------------------------- */

/*
    anythingSlider v1.2

    By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/

*/

#people .anythingSlider                         { width: 690px; height: 400px; position: relative; margin: 20px auto 20px auto; border-bottom:0px solid #b8b8b8; }
#people .anythingSlider .wrapper                { width: 690px; overflow: hidden; height: 400px; margin: 0 0; position: absolute; top: 0; left: 0; }

                                       /* Width below is max for Opera */

#people .anythingSlider .wrapper ul             { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; border-top: 0px solid #e0a213; border-bottom: 0px solid #e0a213; margin: 0; }
#people .anythingSlider ul li                   { display: block; float: left; padding: 0; height: 400px; width: 690px; margin: 0; }
#people .anythingSlider ul li img                                      { float:left; }
#people .anythingSlider .arrow                  { /*display: none; */height: 38px; width: 36px; background: url(../images/people-slider-buttons-01.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 0px; cursor: pointer; }
#people .anythingSlider .forward                { background-position: -38px 0; right: 0; top: 150px; }
#people .anythingSlider .back                   { background-position: 0 0; left: 0; top: 150px }
#people .anythingSlider .forward:hover          { background-position: -38px -38px; }
#people .anythingSlider .back:hover             { background-position: 0 -38px; }

 

#people #thumbNav                               { position: relative; top: 410px; text-align: center; width:250px; margin: 0 auto; z-index:9999; height:20px; } /*increase the width here if you have an huge amount of objects in the slider*/

 

.left{float:left;}

/*vtip*/

p#vtip {
            display: none;
            position: absolute;
            padding: 10px;
            left: 5px;
            background-color: black;
            border: 1px solid white;
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            z-index: 9999;
            font-size:11px;
            line-height:normal;
            color: white;
}

 

p#vtip #vtipArrow {
            display: none;
            position: absolute;
            top: -10px;
            left: 5px;
}

 

 

 

/* ----------New Sub Navigation-------------- */

div#sidebar{
            float:left;
            border: 0px solid #000;
            width:230px;
            margin:16px 0 0 0;
}

#navigation {
            border:0px solid #000;
            margin:0px;
            padding:0px;
            text-indent:0px;
            width:230px;
            text-decoration:none;
}

#navigation a.head {
            font-size:12px;
            cursor:pointer;
            border-bottom:1px solid #B8B8B8;
            color:#757575;
            display:block;
            font-weight:bold;
            text-decoration:none;
            margin:0px;
            padding: 5px 5px 5px 15px;
            background-repeat: no-repeat;
            background-position: 5px 8px;
}

#navigation a.head:hover {
            color:#E70f47;
            text-decoration:none;
}

#navigation a.head:visited {
            text-decoration:none;
}

#navigation a.selected {
            text-decoration:none;
}

#navigation a.active {
            text-decoration:none;
            color: #000000;
}

#navigation a.current {
            text-decoration:none;
            color:#E70f47;
            padding:5px 5px 5px 20px;
			font-weight:bold;

}

#navigation ul {
            border-bottom:1px solid #B8B8B8;
            margin:0px;
            padding:0px;
            text-indent:0px;
}

#navigation li {
            list-style:none outside none; 
            display:inline;
            text-decoration:none;
}

#navigation li li a {
            font-size:12px;
            color:#000000;
            display:block;
            text-indent:0px;
            text-decoration: none;
            padding:5px 5px 5px 20px;
}

#navigation li li a:hover {
            /*background-color: #E9E9E9;*/
            color:#E70f47;
            padding:5px 5px 5px 20px;
            border: 0px solid #000000;
            /*background: #aaa;*/
            /*border-left: 5px #000 solid;*/
            /*padding-left: 15px;*/
}

 

#wizard {
            width: 200px;
            border: 1px solid black;
}

#wizard .title {
            background-color:#DDDDDD;
}

ul.menu, ul.menu ul {
  list-style-type:none;
  margin: 0;
  padding: 0;
  width: 15em;
}

ul.menu a {
  display: block;
  text-decoration: none;   
}

ul.menu li {
  margin-top: 1px;
}

ul.menu li a, ul.menu ul.menu li a {
  background: #333;
  color: #fff;        
  padding: 0.5em;
}

ul.menu li a:hover, ul.menu ul.menu li a:hover {
  background: #000;
}

ul.menu li ul li a, ul.menu ul.menu li ul li a {
  background: #ccc;
  color: #000;
  padding-left: 20px;
}

ul.menu li ul li a:hover, ul.menu ul.menu li ul li a:hover {
  background: #aaa;
  border-left: 5px #000 solid;
  padding-left: 15px;
}

ul.menu ul.menu li a:hover {
    border-left: 0;
    padding-left: 0.5em;
}

ul.menu ul.menu {
    border-left: 5px #f00 solid;
}

ul.menu a.active, ul.menu ul.menu li a.active, ul.menu a.active:hover, ul.menu ul.menu li a.active:hover {
    text-decoration: underline;
    background: #c00;
}

div.panel {
    border: 1px #000 solid;
    padding: 5px;
    margin-top: 1px;
}

ul.menu div.panel a, ul.menu div.panel li a:hover  {
    display :inline;
    color: #666;
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    font-weight: bold;
}

ul.menu div.panel a:hover {
    color: #000;
    text-decoration: underline;
}

.code { border: 1px solid #ccc; list-style-type: decimal-leading-zero; padding: 5px; margin: 0; }
.code code { display: block; padding: 3px; margin-bottom: 0; }
.code li { background: #ddd; border: 1px solid #ccc; margin: 0 0 2px 2.2em; }
.indent1 { padding-left: 1em; }
.indent2 { padding-left: 2em; }
.indent3 { padding-left: 3em; }
.indent4 { padding-left: 4em; }
.indent5 { padding-left: 5em; }
.indent6 { padding-left: 6em; }
.indent7 { padding-left: 7em; }
.indent8 { padding-left: 8em; }
.indent9 { padding-left: 9em; }
.indent10 { padding-left: 10em; }

 
/* ----------------------------------------------------------------------------------------------------------
  Tool Tip
---------------------------------------------------------------------------------------------------------- */

.bubbleInfo {
            float: left;
/*            position: relative;
            top: 150px;
            left: 100px;
            width: 500px;*/
        }
		
        .trigger {
            /*position: absolute;*/
        }

        /* Bubble pop-up */

        .popup {
            position: relative;
            display: none;
            z-index: 50;
            border-collapse: collapse;
        }

        .popup td.corner {
            height: 15px;
            width: 19px;
        }

        .popup td#topleft {background-image: url(../images/tooltip/bubble-1.png);}
        .popup td.top { background-image: url(../images/tooltip/bubble-2.png); }
        .popup td#topright { background-image: url(../images/tooltip/bubble-3.png); }
        .popup td.left { background-image: url(../images/tooltip/bubble-4.png); }
        .popup td.right { background-image: url(../images/tooltip/bubble-5.png); }
        .popup td#bottomleft { background-image: url(../images/tooltip/bubble-6.png); }
        .popup td.bottom { background-image: url(../images/tooltip/bubble-7.png); text-align: center;}
        .popup td.bottom img { display: block; margin: 0 auto; }
        .popup td#bottomright { background-image: url(../images/tooltip/bubble-8.png); }

        .popup table.popup-contents {
            font-size: 12px;
            line-height: 1.2em;
            background-color: #fff;
            color: #666;
            font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
            }

        table.popup-contents th {
            text-align: right;
            text-transform: uppercase;
            }

        table.popup-contents td {
            text-align: left;
            }

        tr#release-notes th {
            text-align: left;
            text-indent: -9999px;
            background: url(http://jqueryfordesigners.com/demo/images/coda/starburst.gif) no-repeat top right;
            height: 17px;
            }

        tr#release-notes td a {
            color: #333;
        }

                        

/* ---------------------------------------------------------------- 
 * Tables
 * ---------------------------------------------------------------- 
*/ 

#main-col table { 
            margin: 20px 0;
            border-collapse: collapse;
            width: 100%;
}    

#main-col table thead th,
#main-col table tfoot th,
#main-col table tfoot td { 
            padding: 5px 15px;
            text-align:left;
}

#main-col table tbody th, 
#main-col table tbody td { 
            padding: 5px 15px;
}

#main-col table thead th {
            color: #fff;
            background-color: #E70f47;
            background-repeat: repeat-x;
}

#main-col table tbody tr th,
#main-col table tbody tr td {
            border-bottom: 1px solid #ddd;
}

#main-col table tbody tr.alt {
            background-color: #eee;
}

#main-col table tfoot tr th,
#main-col table tfoot tr td { 
            background-color: #ddd;
}

/* ---------------------------------------------------------------- 
 * Product page Tabs
 * ---------------------------------------------------------------- 
*/

/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

div#rotate{ margin:20px 20px 0 20px;}

/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    /*font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif;*/
    font-size: 12px;
}
.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
	border-bottom: 1px solid #757575;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0 0 0 5px;
    min-width: 84px; /* be nice to Opera */
	list-style-type: none;
}
.ui-tabs-nav a, .ui-tabs-nav a span {
	display: block;
	padding: 0 10px;
	background: url(../images/tab.png) no-repeat;
	list-style-type: none;	
}
.ui-tabs-nav a {
    margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    color: #757575;
    font-weight: normal;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
    outline: 0; /* prevent dotted border in Firefox */
}
.ui-tabs-nav a:hover {
	color: #E70f47;
}

.ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 1px;
    z-index: 2;
    margin-top: 0;
    color: #E70f47;
}
.ui-tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.ui-tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.ui-tabs-nav .ui-tabs-selected a span {
    padding-bottom: 1px;
}
.ui-tabs-nav .ui-tabs-selected a, .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active {
    background-position: 100% -150px;
}
.ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active {
    background-position: 100% -100px;
}
.ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:hover span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span {
    background-position: 0 -50px;
}
.ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span {
    background-position: 0 0;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-deselectable a:hover, .ui-tabs-nav .ui-tabs-deselectable a:focus, .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}
.ui-tabs-panel {
    /*border-top: 1px solid #757575;*/
    padding: 1em 8px;
    background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
}
.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(css/loading.gif) no-repeat 0 50%;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}

/* ---------------------------------------------------------------- 
 * News Updates
 * ---------------------------------------------------------------- 
*/

#feat-story{margin:0 20px 20px 20px;border-bottom:1px solid #b8b8b8;}
.news-image{float:left; margin:20px 20px 0 0;}
.sub-story{margin:0 0 20px 20px; float:left; width:335px;}
.sub-story h3{margin:0 0 0 0; padding:0 0 10px 0; font-size:16px;}
.sub-story img{ float:left; margin:0 18px 0 0;}
.sub-story p{font-size:11px; padding:0 0 10px 0; margin:0 0 0 0; line-height:15px;}
#exhibitions{margin:0 20px 0 20px;border-top: 1px solid #b8b8b8;}
#main-col #exhibitions table tbody tr td {border-bottom: 0px solid #ddd;}
#main-col #exhibitions table tbody td {padding: 3px 15px 3px 0;}
#news-archive{margin:0 20px 0 20px;border-top: 0px solid #b8b8b8;}{margin:0 20px 0 20px;border-top: 1px solid #b8b8b8;}
#main-col #news-archive table tbody tr td {border-bottom: 0px solid #ddd;}
#main-col #news-archive table tbody td {padding: 3px 15px 3px 0;}
.header-divider h2{ border-top: 1px solid #b8b8b8; border-bottom: 1px solid #b8b8b8; margin:10px 20px; padding:5px 0;}

/* ----------------------------------------------------------------------------------------------------------
 Side Bar Contact Area
---------------------------------------------------------------------------------------------------------- */

#contact-area{ padding:0 0 15px 15px;}

.displace {
	position: absolute;
	top: -9999px;
}
a.contact-button {
	display: block;
	width: 193px;
	height: 34px;
	text-decoration: none;
	background-image: url(../images/contact-btn.gif);
	margin: 3px;
	bottom: 10px;
}

a.contact-button:hover {background-position: 0 -34px;}
.trigger{ font-size:11px; text-decoration:underline;color:#E70f47; cursor:pointer;}
#contact-area p{padding:10px 0 0 0; margin:0;}
#contact-area ul{padding:0 0 10px 0; margin:0; list-style:inside; font-size:16px; color:#E70f47;}
#contact-area ul li{
	padding:10px 0 0 10px;
	margin:0 0 0 5px;
	background-image: url(../images/contact-bullet.gif);
	background-repeat: no-repeat;
	list-style-type: none;
	background-position: 0px 16px;
}