﻿/************************
 * INLINE GALLERY: home page specific styles
 ************************/
 
ul#quicklinks,
ul.quicklinks {
    margin-bottom: 25px;
}
ul#quicklinks li,
ul.quicklinks li {
    margin: 0 10px 10px 0;
    background: none;
}
ul#quicklinks li h2,
ul.quicklinks li h2 {
    margin: 10px 0 0 0;
    padding: 0 0 5px 0;
    zoom: 1; /* This is to make IE havelayout because it was adding extra padding below the bottom border */
    font-size: 1em;
}
ul#quicklinks li h2 a,
ul.quicklinks li h2 a {
    text-decoration: none;
}
ul#quicklinks li h2 a:hover,
ul.quicklinks li h2 a:hover {
    text-decoration: underline;
    color: #36627B;
}
ul#quicklinks li img,
ul.quicklinks li img {
    float: left; display: inline;
    margin: 0 10px 0 0;
}
ul#quicklinks li p,
ul.quicklinks li p {
    margin: 0;
    padding: 0;
}
ul#quicklinks li .more-link,
ul.quicklinks li .more-link {
    clear: both;
    padding: 5px 0 0 0;
}
ul#quicklinks li .multiple-more-links .more-link,
ul.quicklinks li .multiple-more-links .more-link {
    padding: 2px 0 0 0;
}


/************************
 * More Link
 ************************/
 
.more-link {
}
.more-link a:link,
.more-link a:visited {
    color: #36627b;
    padding-right: 15px;
    background: url(bg_primary-navigation-09.png) transparent right -186px no-repeat;
}
.more-link a {
    padding-bottom: 3px;
}
.more-link a:hover {
    color: #ed1c24;
    background-position: right -166px;
}
.multiple-more-links {
    padding: 1.1em 0 0 0;
}
.multiple-more-links .more-link {
    padding: 2px 0 0 0;
}

/************************
 * More Link JS enhanced - THIS IS ONLY FOR IE
 ************************/
 
html.js .more-link-ie-fix a:link,
html.js .more-link-ie-fix a:visited {
    color: #36627b;
    padding-right: 0;
    background-image: none;
}
html.js .more-link-ie-fix a span {
    width: 11px;
    height: 11px;
    margin-left: 4px;
    display: inline-block;
    background: url(bg_primary-navigation-09.png) transparent right -189px no-repeat;
    _background-position: right -186px; /* IE6 was getting the height wrong */
}
html.js .more-link-ie-fix a:hover span {
    background-position: right -169px;
    _background-position: right -166px; /* IE6 was getting the height wrong */
}

/************************
 * Whitepaper Listing
 ************************/
.whitepaper-container {
    float: left;
    width: 255px;
    margin: 0 10px 0 0;
}
.whitepaper-container h3 {
    margin: 0;
}
ul.whitepaper-listing {
    list-style-type: none;
    margin: 0;
    padding: 0 0 1em 0;
}
ul.whitepaper-listing li {
    background-image: none;
    margin: 0;
    padding: 2px 0 0 0;
}
/************************
 * Next / previous Link
 ************************/
ul.next-prev {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
ul.next-prev li {
    float: left; display: inline;
    background-image: none;
    margin: 0;
    padding: 0;
}
ul.next-prev li.next {
     
}
ul.next-prev li.prev {
    border-right: 1px solid #D2E1E6;
}
ul.next-prev li a {
    padding: 5px 15px 5px 25px;
    display: block;
    color: #36627B;
    text-decoration: none;
    outline: none; /* Remove focus dotted border */
    background: url(bg_primary-navigation-09.png) transparent left -207px no-repeat;
}
ul.next-prev li a:hover {
    text-decoration: underline;
    background-position: left -237px;
}
ul.next-prev li.next a {
    padding-right: 25px;
    padding-left: 15px;
    background-position: right -207px;
}
ul.next-prev li.next a:hover {
    background-position: right -237px;
}

/*****************************************************************************************
 *            fixed width box styles
 ****************************************************************************************/
#webinars,
#tours,
#case-studies,
#contact,
.box {
    margin-top: 7px;
    margin-bottom: 7px;
}
#sub .box {
    float: right;
    width: 100%;
    margin-bottom: 14px; /* 7px + margin-bottom above to give real gap between boxes */
}
#webinars h2,
#tours h2,
#case-studies h2,
#contact h2,
.box h2 {
    margin: -7px 0 0 0;
    padding: 14px 11px 0 16px;
    font-size: 1.5em;
    background-image: url(boxes.png);
    position: relative;
    _height: 0; /* This is to stop the IE scroll bug */
}
#sub .box h2 {
    padding: 7px 10px 0 10px;
}
#webinars .content,
#tours .content,
#case-studies .content,
#contact .content,
.box .content {
    background-image: url(boxes.png);
    min-height: 92px;
    _height:92px;
    margin-bottom: -7px;
    padding: 11px 16px;
    _padding: 12px 16px;
    position: relative; /* make IE6 respect the negative margin */
    font-size: 0.92em;
}
#sub .box .content {
    padding: 10px;
}

#page #sub .red-box .content .content-image {
    float: none;
    clear: none;
    padding: 0;
}

/************************
 * grey boxes
 ************************/
/* box colors */
#case-studies,
#contact {
    background-color: #feffff;
}
/* box images */
#case-studies .content,
#contact .content {
    background-position: -644px 100%;
}
#case-studies h2,
#contact h2 {
    background-position: -644px 0;
    color: #36627b;
}
#case-studies h2 a,
#contact h2 a,
#case-studies h2 a:hover,
#contact h2 a:hover,
#case-studies h2 a:active,
#contact h2 a:active {
text-decoration: none;
color: #36627b;
}


/************************
 * right column boxes
 ************************/
#webinars,
#tours,
#case-studies,
#contact {
    float: right;
    clear: right;
    width: 322px;
    margin-bottom: 13px; /* 7px is used by overhanging box bottom */
}
#case-studies,
#contact {
    width: 323px;
}
/* adjust min height's */
#case-studies .content {
    min-height: 129px;
    *min-height: 131px;
     _height: 131px;	
}
@media all and (min-width: 0px) {
	body:not(:root:root) #case-studies .content {
		min-height: 123px;
	}
}
#tours .content {
    height: 112px;
    _height: 114px;
	*height: 114px;
    overflow:hidden;
}
@media all and (min-width: 0px) {
	body:not(:root:root) #tours .content {
		height: 104px;
	}
}
#contact .content {
    min-height: 36px;
    _height: 36px;
}


/*****************************************************************************************
 *            right hand box shared styling
 ****************************************************************************************/
#webinars,
#tours,
#case-studies {
    position: relative;
}
/* position the images correctly to the right of the boxes */
#tours .content-image {
    position: absolute;
    top: 0;
    right: 0;
}
#webinars .content-image,
#case-studies img {
    position: absolute;
    top: 0;
    right: 10px;
}

/************************
 * slideshow content 
 ************************/
#tours .content ul,
#case-studies .content ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    min-height: 110px;
    _height: 110px;
}
/* hide all items in the list of slideshow items by default */
#tours .content ul li,
#case-studies .content ul li {
    position: absolute;
    left: -9999em;
    width: 140px;
	font-size:12px;
    padding: 0;
    padding-right: 151px;
    background-image: none;
}
/* and only show the first one if there's no javascript */
#tours .content ul li.first,
#case-studies .content ul li.first {
    position: relative;
    left: 0;
	text-align:left;
}

/************************
 * slideshow paging controls 
 ************************/
#tours ul.next-prev,
#case-studies ul.next-prev {
    position: absolute;
    top: 5px;
    right: 15px;
}
