/* 
========================================================================================================= CREDITS
Copyright : Copyright (c) 2009 JPL. All Rights Reserved.
Author(s) : Samuel Wissler - swissler@jplcreative.com
Date      : 2/16/2009 
Notes     : Styles for the product page expand-collapse bars.
========================================================================================================= CHANGE LOG
Date		Name				Desc
========================================================================================================= BEGIN CSS
*/

.product-category {
	background: url(../img/products/group_bg.gif) repeat-x;
	float: left;
	margin-bottom: 10px;
	width: 660px;
}

.product-category h3 {
	float: left;
	height: 28px;
	margin: 0px 0px 0px 2px;
	width: 95%;
}

.expand-all, .collapse-all { 
	float: right;
	height: 20px;
	margin: 0px -15px 10px 0px;
	width: 101px;
}

.expand-all {
	background: url(../img/buttons/expand_all.gif) no-repeat;
}

.collapse-all {
	background: url(../img/buttons/collapse_all.gif) no-repeat;
}

.expand, .collapse { 
	background: url(../img/products/expand.gif) no-repeat;
	float: left; 
	height: 19px;
	margin: 4px 0px 0px 5px;
	width: 21px; 
}

.collapse { background: url(../img/products/collapse.gif) no-repeat; }

#small-spirals-title { background: url(../img/products/small_spirals.jpg) no-repeat; }
#vending-line-title { background: url(../img/products/vending_line.jpg) no-repeat; }
#large-spirals-title { background: url(../img/products/large_spirals.jpg) no-repeat; }
#big-boxes-title { background: url(../img/products/big_boxes.jpg) no-repeat; }
#hundred-calorie-title { background: url(../img/products/hundred_calorie.jpg) no-repeat; }
#gum-mints-title { background: url(../img/products/gum_mints.jpg) no-repeat; }
#king-size-title { background: url(../img/products/king_size.jpg) no-repeat; }

#small-spirals-content, #vending-line-content, #large-spirals-content, 
#big-boxes-content, #hundred-calorie-content, #gum-mints-content, #king-size-content { display: none; }

table { clear: left; }
table td, .label td { padding-right: 10px; }

.modal-content .sifr, .modal-content .slogan { margin-bottom: 10px; }
.modal-content img { float: left; margin: 0px 5px 10px 0px; }