/*
Theme Name: 	SouthCentre
Theme URI: 		http://www.candy-fatory.ch
Description: 	Use restricted only to www.southcentre.org
Version: 		1.0
Author: 		Candy Factory
Author URI: 	http://www.candy-fatory.ch
*/

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Media queries 
04 Main styling
05 Header styling
05a Header Menu styling
06 Inside styling
07 Sidebar styling
08 Homepage styling
09 Common styling
10 Footer styling
11 Contact page
12 Misc common Styling
13 Woocommerce Styling
14 Special Category Styling
A1 External Colorbox Styling
===========================
*/

/* ---------------------------------------------------------------------------------------------------------- 
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@import "css/reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
::-moz-selection 	{ background:#e36929; color:#333; }
::selection 		{ background:#e36929; color:#333; }
.clear {width:100%;clear:both;height:1px;margin-top:-1px;}

a, a:active, a:focus {
	outline: none;
}


/* ---------------------------------------------------------------------------------------------------------- 
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

body,
input,
textarea 			{
					font-family:arial, sans-serif;
					font-weight:normal;
					font-size:12px;
				}

h1, 
h2, 
h3, 
h4, 
h5, 
h6 					{
						font-weight:bold;
						font-size:15px;
					}

a {
	color:#E36929;
}
/* ---------------------------------------------------------------------------------------------------------- 
03 Media queries (using a mobile-first approach) ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */


/* ---------------------------------------------------------------------------------------------------------- 
04 Main styling ---------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
body {
	background: url("./img/MainBG.png") repeat scroll center 345px transparent;
	font-family: arial, sans-serif;
	font-size: 12px;
}
.wrapper {
	width:900px;
	margin:0 auto;
}
h1,h2 {
	font-size:15px;
}
.clear {
	width: 100%;
	position: relative;
	height: 1px;
	clear: both;
	margin-top: -1px;
}

/* ---------------------------------------------------------------------------------------------------------- 
05 Header styling -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
header {
	height:409px;
	background: url("./img/pattern_repeatX_header.png") repeat-x scroll center top transparent;
}
header #top_links {
	margin:5px 0 0 40px;
	height:45px;
	width:250px;
	float:left;
}
header #top_links img{
	max-width: none !important;
}
header .signet {
	width:24px;
	height:30px;
	overflow:hidden;
	float:left;
	margin-left:1px;
}
header .signet a:hover{
	margin-left:-24px;
}
header #top_search {
	float:right;
    margin-top: 14px;
    border: 1px solid #333333;
}
header #searchform {
	width: 125px;
}
header #top_lang {
	float:right;
    margin-top: 16px;
    margin-right: 38px;
}
header #top_lang .lang_sel_sel{
	border:none;
	border-bottom: 1px solid #000000;
	font-family: arial, sans-serif;
	font-size: 12px;
	height: 21px;
	width:115px;
}
header #top_lang a {
	color: #333333;
	text-decoration: none;
}
header #top_lang a:hover {
	color: #e36929;
}
header #top_lang #lang_sel li, header #top_lang #lang_sel ul ul {
	width: 125px;
}
header #top_lang #lang_sel ul ul{
	top:22px;
}
header #top_lang #lang_sel{
	z-index: 500;
}
header #lang_sel *:hover > a {
	position: relative;
	z-index: 500;
}
header #top_slider {
	float:left;
	position:relative;
	z-index:1;
	width: 900px;
	height: 300px;
	overflow: hidden;
}
header #top_slider {

}
header #over_slider {
	position:relative;
	float:left;
	margin-top:-309px;
	z-index:10;
	width: 900px;
	height: 309px;
}
/* Remove Stlye in case of inside content Header */
#inside_content header {
	background: none;
	height: auto;
	margin: 5px 0;
}

/*
	Header Slider styling
*/
#top_slider {
	background-color: #f4f4f4;
}
#header_slider_logo {
	position: absolute;
	z-index: 10;
	margin-top: 171px;
	margin-left: 27px;
}
#top_slider .header_slider  {
	opacity: 0;
	transition: all 750ms;
	position: absolute;
}
#top_slider .slider_visible {
	opacity: 1;
}
.header_slider_text {
	position: absolute;
	z-index: 2;
	width: 260px;
	height: 224px;
	margin: -279px 0 0 615px;
	overflow: hidden;
}
#top_slider .header_slider_title {
	font-size: 13px;
	font-weight: bold;
	line-height: 140%;
}
#top_slider .header_slider_content {
	line-height: 140%;
	margin-top: 20px;
}
#top_slider #header_slider_control {
	position: absolute;
	z-index: 10;
	width: 260px;
	height: 5px;
	margin: 263px 0 0 615px;
}
#top_slider #header_slider_control .header_slider_dot {
	width: 5px;
	height: 5px;
	background-color: #333333;
	border-radius: 5px;
	margin-right: 5px;
	display: inline-block;
	transition: all 350ms;
}
#top_slider #header_slider_control .header_slider_dot.current_dot, #top_slider #header_slider_control .header_slider_dot:hover {
	background-color: #e36929;
	cursor: pointer;
}
/* ---------------------------------------------------------------------------------------------------------- 
05a Header Menu styling -------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
header #top_menu {
	margin:5px 0 0 27px;
	clear:both;
	width:850px;
	height:50px;
}
#megaMenu {
	margin-top:5px;
}
	/*
		background: url("./img/icon_arrow_yellow_down.png") no-repeat scroll right center transparent;
	 */

/* ---------------------------------------------------------------------------------------------------------- 
06 Inside styling -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#content {
	background-color:#ffffff;
}
#breadcrumbs {
    background: url("./img/bg_breadcrumbs.png") no-repeat scroll left top transparent;
    height: 30px;
    margin-left: 280px;
    width: 531px;
	font-size: 12px;
    padding: 15px 0 0 50px;
}
#breadcrumbs a{
	color:#333333;
	text-decoration:none;
}
#breadcrumbs a:hover{
	border-bottom:1px solid #333333;
}
#inside_content {
	float:left;
	width:581px;
	margin-left:40px;
	margin-bottom: 20px;
}

h2 {
	width: 100%;
	margin: 20px 0;
	padding: 5px 0;
	font-size: 15px;
	text-transform: uppercase;
	text-align: center;
	background-color: #f4f4f4;
}

/* ---------------------------------------------------------------------------------------------------------- 
07 Sidebar styling -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#sidebar {
	float:left;
	width:245px;
	margin-left:-5px;
	color:#ffffff;
}
#sidebar .black_sidebar, #sidebar .orange_sidebar{
	margin-bottom:20px;
}
#sidebar .black_sidebar{
	width:155px;
	background-color:#333333;
	padding:15px 45px;
}
#sidebar .orange_sidebar{
	width:205px;
	padding:15px 20px;
	background-color:#e36929;
}
#sidebar h3{
	font-size:15px;
	font-weight:normal;
	height: 25px;
    margin-bottom: 10px;
}
#sidebar .orange_sidebar > div{
	margin-left:10px;
}
#sidebar .black_sidebar h3 {
	background: url("./img/icon_yellow_dotted_line.png") no-repeat scroll bottom left transparent;
}

#first_sidebar li , #third_sidebar li{
  background:url("./img/icon_arrow_right_yellow.png") center left no-repeat !important;
  margin-left:-15px !important;
  margin-bottom: 5px !important;
  padding-left: 15px !important;
  border:none !important;
  list-style: none;
}
#first_sidebar li a, #third_sidebar li a{
	color: #ffffff;
	text-decoration: none;
}
#first_sidebar li a:hover, #third_sidebar li a:hover{
	color: #e36929;

}
#second_sidebar li {
	background:url("./img/button_arrow_right.png") 173px top no-repeat #ffffff;
	height: 17px;
	width: 180px;
	margin-bottom: 1px;
	padding-left: 15px;
	padding-top: 4px;
	cursor: pointer;
}
#second_sidebar li:hover {
	background:url("./img/button_arrow_right_hover.png") 173px top no-repeat #ffffff;
}
#second_sidebar li a{
	color: #333333;
	text-decoration: none;
}
#second_sidebar li a:hover, #second_sidebar li .hovered{
	color: #e36929;
}
#sidebar .orange_sidebar h3 {
	padding-left: 15px;
}

#forth_sidebar .mergeRow, #forth_sidebar #mc-indicates-required{
	display:none;
}
#forth_sidebar {

}
#forth_sidebar label {
	display: none;
}
#forth_sidebar input {
	border: none;
	height: 20px;
	overflow: hidden;
	padding: 1px 13px 0;
	margin-bottom: 1px;
}
#forth_sidebar .mc_merge_var {
	width: 	174px;
	margin-bottom: 1px;
}
#forth_sidebar .mc_signup_submit{
	float: right;
	width: 21px;
	margin-top: -62px;
}
#forth_sidebar #mc_signup_submit{
	background: url("./img/newsletter-add_button.png") no-repeat scroll right center transparent;
 	float: right;
    height: 43px;
    text-indent: -9999px;
    width: 21px;
}
#forth_sidebar #mc_message {
	width: 195px;
	background-color: white;
	font-size: 11px;
	font-style: italic;
	margin-bottom: 5px;	
}
#mc_message span, #mc_message strong {
	padding: 10px;
	display: block;
}

#sidebar #fifth_sidebar {
	padding-left: 30px;
	padding-right: 20px;
	width: 195px;

}

#sidebar #fifth_sidebar h3{
	background: #ffffff;
	color: #333333;

	border: medium none;
    height: 20px;
    margin-bottom: 1px;
    overflow: hidden;
    padding: 1px 0 0 13px;
    width: 182px;
}
#sidebar #fifth_sidebar a {
	text-decoration: none;
}
#sidebar #fifth_sidebar #icon_eshop {
	display: block;
	float: right;
	width: 22px;
	overflow: hidden;
	margin-top: -1px;
}
#sidebar #fifth_sidebar #icon_eshop img{
	max-width: none;
}
#sidebar #fifth_sidebar a:hover #icon_eshop img{
	margin-left: -22px;
}
/* ---------------------------------------------------------------------------------------------------------- 
08 Homepage styling -----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#homepage .section {
	width: 268px;
	float:left;
	overflow: hidden;
	border: 1px solid #F4F4F4;
}
#homepage #infocus_left {
	float:left;
	width: 270px;
}
#homepage #infocus_right {
	float:right;
	width: 270px;
}
#homepage .section h3{
	line-height: 17px;
	background-color: #333333;
	padding: 2px 10px;
	width: 250px;
}
#homepage .section h3 a{
	color: #ffffff;
	text-decoration: none;
	font-size: 12px;
	line-height: 19px;
}
#homepage #section_0, #homepage #section_2 {
	margin-right: 40px;
	clear: left;
}
#homepage #section_1, #homepage #section_3 {
	clear: right;
	float: right;
}
#homepage #section_0, #homepage #section_1 {
	margin-bottom: 2px;
}

#homepage .section .featured_image {
	margin-top: 20px;
	width: 270px;
	overflow:hidden;
	height:185px;
}
#homepage .section .featured_image_over, #homepage .section_key .featured_image_over{
	float:left;
	position: relative;
	z-index: 10;
}
#homepage .section .featured_image_over:hover{
	margin-left: -270px;
}
#homepage .section .feature_image_content {
	width: 270px;
	height: 180px;
	position: absolute;
	z-index: 1;
}
#homepage .section .feature_image_content img{
	width: 270px;
	height: 180px;
}
#homepage .section .featured_content {
	margin: 15px 0;
	line-height: 150%;
	min-height: 90px;
	padding: 0 25px;
}

#homepage .section .featured_content .excerpt_text{
	min-height: 90px;
}
#homepage .section .featured_content .excerpt_text a{
	font-style: italic;
	color: #a7a7a7;
}
#homepage .section .featured_content .excerpt_text a:hover{
	color: #e36929;
	text-decoration: none;
}
#homepage .section .featured_image a:hover,#homepage .section_key .featured_image a:hover {
	border: none;
}
#homepage .toggle_section{
	position: absolute;
	right: 0;
	top:0;
}
#homepage .toggle_section:hover {
	border: none;
}

#homepage .section_key {
	width: 180px;
	float: left;
	margin-right: 20px;

}
#homepage #key_section_2 {
	margin-right: 0;
}
#homepage .section_key h4{
	padding: 10px 0 0;
	height: 40px;
}
#homepage .section_key h4 a{
	color: #333333;
	font-size: 15px;
	font-weight: bold;
}
#homepage .section_key .featured_image {
	width: 180px;
	height: 120px;
	overflow: hidden;
}
#homepage .section_key .feature_image_content {
	width: 180px;
	height: 120px;
	position: absolute;
	z-index: 1;
}
#homepage .section_key .featured_image_over:hover{
	margin-left: -180px;
}
#homepage .section_key .featured_content .excerpt_text{
	min-height: 40px;
	display: none;
}

/* ---------------------------------------------------------------------------------------------------------- 
09 Common styling -----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#inside_content {
	color:#333333;
}
#inside_content p {
	margin-bottom: 10px;
}
#inside_content ul,ol {
	padding: 5px 0 10px 25px;
}
#inside_content ul li {
	list-style: square outside none;
}
#inside_content ol li {
	list-style: upper-roman outside none;
}
#inside_content a {
	color:#e36929;
	text-decoration: none;
}
#inside_content a:hover {
	border-bottom: 1px solid #e36929;
}
#inside_content blockquote{
	padding: 15px;
	background-color: #eeeeee;
}
#inside_content .excerpt {
	background:url("./img/icon_double_arrow_right.png") center left no-repeat;
	padding-left: 30px;
}
#inside_content .excerpt a {
	color:#a7a7a7 !important;
	font-size: 13px;
	font-style: italic;	
}
#inside_content .excerpt a:hover {
	color: #e36929 !important;
	border: none !important;

}

#searchsubmit {
	background: url('./img/icon_search.png') center right no-repeat transparent;
	border: medium none;
    height: 20px;
    text-indent: -9999px;
    width: 15px;
    float: left;
}
#s {
	border:none;
	width: 97px;
	height: 15px;
	padding: 1px 0 3px 10px;
	float: left;
}
.wpptopdfenh {
	padding: 20px 0;
	width: 20px;
	overflow: hidden;
	display: block;
	cursor: pointer;
}
.wpptopdfenh:hover {
	border: none !important;
}
.wpptopdfenh:hover img{
	margin-left: -20px;
}
.center {
	text-align: center;
}
.center a {
	width: 20px;
	margin: 0 auto;
}
/* ---------------------------------------------------------------------------------------------------------- 
10 Footer styling -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
footer {
	background: url("./img/pattern_repeatX_footer.png") top left repeat-x;
	height: 100px;
	width: 100%;
	margin-top: 20px;
}
footer #footer_links, footer #footer_copyright {
	width:900px;
	margin:0 auto;	
}
footer #footer_links {
	height: 47px;
}
footer #footer_copyright {
	border-top: 4px solid #ffffff;
	font-size: 11px;
	color:#999999;
	text-align: center;
	padding-top: 17px;
}
footer a{
	color: #999999;
	text-decoration: none;
}
footer a:hover{
	color:#ffffff;
}
footer #footer_copyright .light, footer #footer_copyright .light:hover{
	color:#999999;
	border: none;
	cursor: default;
}


footer #footer_right {
	float:left;
	width: 620px;
	height: 28px;
	padding-top:17px;
	padding-left: 40px;
}
footer #footer_left {
	margin:13px 0 0 20px;
	height:32px;
	width:220px;
	float:left;
}
footer .signet {
	width:25px;
	height:50px;
	overflow:hidden;
	float:left;
	margin-left:1px;
}
footer .signet a:hover{
	margin-left:-25px;
}
footer #footer_links ul,footer #footer_links ul li{
	display: inline;
}
footer #footer_links a{
	text-transform: uppercase;
	font-size: 12px;
}
footer #footer_links img{
	max-width: none !important;
}
footer #footer_links ul li{
	padding-right: 10px;
	border-right: 1px solid #999999;
	margin-right: 10px;
}
footer #footer_links ul li:last-child{
	padding: 0;
	margin: 0;
	border: none;
}

#dynamic-to-top {
	right:auto !important;
	left:50% !important;
	margin-left:445px !important;
	margin-bottom:105px;
}

/* ---------------------------------------------------------------------------------------------------------- 
11 Contact page ---------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
.left_column {
	width: 270px;
	margin-right: 40px;
	float: left;
}
.right_column {
	width: 270px;
	float: right;
}
.wpcf7-form input,.wpcf7-form textarea {
	border: 1px solid #E36929;
	padding: 3px 15px;
	width: 240px;
}
.wpcf7-form textarea {
	height: 167px;
}
#cap_entry {
	width: 175px;
}
#inside_content .wpcf7-form p {
	margin:5px 0 20px;
}
#inside_content .wpcf7-submit {
	margin-top: 22px;
	width: 269px;
}
div.wpcf7-validation-errors, .wpcf7-response-output {
	clear: both;
}
/* ---------------------------------------------------------------------------------------------------------- 
12 Misc common Styling --------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/* FAQ Styling */
.single-faq {
}
.single-faq h3 {
	color:#E36929;
	font-size: 12px;
	font-weight: normal;
	background: url('./img/bullet.png') center left no-repeat;
	padding-left: 25px;
	cursor: pointer;
	padding: 5px 0 5px 25px;
}
.single-faq .faq-answer {
	padding: 0 0 5px 25px;
}

p.faq-question {
	padding-bottom:15px;
}

p.faq-answer {
	padding:0 0 15px 15px;
	font-style:italic;
}

/* Dropbox plugin */
#Hyno_ContenFolder {
	height: 800px;
}

/* Mailchimp archive */
#inside_content .display_archive {
	max-height: 800px;
	overflow: auto;
}

/* ---------------------------------------------------------------------------------------------------------- 
13 Woocommerce Styling --------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#woocart_archive {
	width: 601px;
	margin-left: -10px;
}
#woocart_archive ul, #woocart_archive ul li {
	list-style: none;
	padding: 0;
	margin: 0;
}
#woocart_archive .products img {
	width: 130px;
	height: 190px;
}
#woocart_archive .products h3 {
	display: block;
	min-height: 80px;
}
#woocart_archive .products a:hover h3 {
	text-decoration: underline;
}
#woocart_archive ul li {
	padding: 0 10px;
	width: 130px;
	margin-bottom: 40px;
}
#woocart_archive .amount{
	color:#333333;
	font-weight: normal;
}

#woocart_archive .price, #inside_content .single_variation {
	padding: 10px 0;
	margin: 0;
}
#woocart_archive del .amount{
	padding-right: 10px;
}
#inside_content #payment ul li{
	list-style: none;
}
#inside_content .product .amount {
	color: #E36929;
	font-weight: bold;
}
#inside_content #woocart_archive .product .amount {
	color: #000000;
}
#inside_content .product .from {
	color: #E36929;
}
#inside_content .product .single_add_to_cart_button,#inside_content .woocommerce .checkout-button, #place_order {
	color: #E36929 !important;
	background: #F7F6F7 !important;
	background: -webkit-gradient(linear,left top,left bottom,from(#F7F6F7),to(#D4CDD2)) !important;
	background: -webkit-linear-gradient(#F7F6F7,#D4CDD2) !important;
	background: -moz-linear-gradient(center top,#F7F6F7 0,#D4CDD2 100%) !important;
	background: -moz-gradient(center top,#F7F6F7 0,#D4CDD2 100%) !important;
    text-decoration: none !important;
    border-color: #C8BFC6 !important;
    text-shadow:none !important;
}
#inside_content .product .single_add_to_cart_button:hover,#inside_content .woocommerce .checkout-button:hover, #place_order:hover {
	border-bottom-color: #E36929 !important;
}
#inside_content .product .woocommerce-main-image .attachment-shop_single {
	width: 278px;
	height: 406px;
}

#inside_content .product .woocommerce-main-image .attachment-shop_single {
	width: 278px;
	height: 406px;
}

#inside_content .checkout h3, #order_review_heading {
	padding-bottom: 15px;
}

#inside_content .reset_variations {
	display: none;
}
#inside_content .woocommerce-info {
	display: none;
}

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
	border: none;
}

.cart-tab {
	top:104px;
}

.woocommerce ul.products li.product .button {
	border: none !important;
}
#inside_content a[rel*="nofollow"] {
	outline: none !important;
}


/* ---------------------------------------------------------------------------------------------------------- 
14 Special Category Styling ---------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
#in_ligne_div {
	width: 591px;
	margin-left: -10px;
}
article.in_ligne {
	float:left;
	width: 135px;
	padding: 0 10px;
}
#in_ligne_div h2{
	font-size: 12px;
	min-height: 120px;
}

img.alignright { float: right; margin: 0 0 1em 1em; }
img.alignleft { float: left; margin: 0 1em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

/* ---------------------------------------------------------------------------------------------------------- 
A1 External Colorbox Styling --------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(img/overlay.png) repeat 0 0;}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(img/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(img/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(img/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(img/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(img/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(img/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(img/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(img/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(img/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(img/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(img/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(img/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(img/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}