/*************** General CSS ******************/
/* 
/* The CSS here should only contain helpers classes and conventions.
/*
/**********************************************/

/* General (CSS reset) */

form {
	margin: 0px;	
}

div {
	margin: 0px;
}

/* Inline elements */

a {
	outline: none;
}

a.ImageLink {
	text-decoration: none !important;	
}

a img {
	border: 0px;
}

.Action {
	cursor: pointer;
	text-decoration: underline;
	text-align: left;
	color: blue;
}

.Tab {
	background-color: transparent;
	padding-right: 7px;
	text-decoration: none !important;
}

.Tab > img {
	vertical-align: bottom;
}

.SelectedTab {
	background-color: transparent;
	padding-top: 5px;
}

span.Important {
	font-weight: bold;
	color: red;
}

.Bold {
	font-weight: bold;
}

.Italic {
	font-style: italic;
}

/* Block elements */

.SmallFont {
	font-size: 12px;	
}

.Clear {
	clear: both;
}

.NoClear {
	clear: none !important;
}

.Block {
	display: block;	
}

div.Clearer {
	clear: both;
	line-height: 0px;
	height: 0px;
}

div.Relative {
	position: relative;
}

.Hidden {
	display: none;
}

.TabSection {
	margin: 10px 5px 0px 5px;
}

.TabHeader {
	padding-top: 4px;
}

.TabContent {
	border-style: solid;
	border-width: 4px 2px 2px 2px;
	border-color: #ffa436;
}

.Center {
	text-align: center;
}

.Left {
	text-align: left;
}

.Right {
	text-align: right;
}

.CenteredBlock {
	margin-left: auto;
	margin-right: auto;
}

.VariableWidthCenteredBlock {
	display: table;
	margin-left: auto;	
	margin-right: auto;
}

.LeftFloatChildren * {
	float: left;	
}

.LeftFloat {
	float: left;	
}

.RightFloat {
	float: right;	
}

.LeftAbsolute {
	position: absolute;
	left: 0px;
	top: 0px;
}

.SuccessMessage {
	background-color: #a4efae;
	border: 1px solid green;
	padding: 4px 4px 4px 4px;
}

.NormalMessage {
	background-color: #ffdb4c;
	border: 1px solid orange;
	padding: 4px 4px 4px 4px;
}

.ErrorMessage {
	background-color: #ef86a8;
	border: 1px solid red;
	padding: 4px 4px 4px 4px;
}

.ShrinkedWidth {
	width: 75%;
}

/* Margin and Padding presets */

.TopSpaced {
	margin-top: 10px;	
}

.TopSpacedLarge {
	margin-top: 30px;	
}

.TopPadded {
	padding-top: 10px;
}

.TopPaddedLarge {
	padding-top: 30px;
}

.BottomSpaced {
	margin-bottom: 10px;	
}

.BottomSpacedLarge {
	margin-bottom: 30px;	
}

.BottomSpacedSmall {
	margin-bottom: 5px;	
}

.BottomPadded {
	padding-bottom: 10px;
}

.LeftSpacedSmall {
	margin-left: 5px;	
}

.LeftSpaced {
	margin-left: 15px;	
}

.LeftSpacedLarge {
	margin-left: 50px;	
}

.RightSpacedSmall {
	margin-right: 5px;	
}

.RightSpaced {
	margin-right: 15px;	
}

.RightSpacedLarge {
	margin-right: 50px;	
}
/** Customizable Elements **/

div.Relative {
	width: auto;			
}

div.InnerContent {
	position: relative;
	background-repeat: repeat;
}

div.TopContent {
	position: absolute;
	width: 100%;
	top: 0px;	
	left: 0px;	
}

div.BottomContent {
	position: absolute;
	width: 100%;
	bottom: 0px;
	left: 0px;
}

div.LeftContent {
	position: absolute;
	height: 100%;
	top: 0px;	
	left: 0px;
}

div.RightContent {
	position: absolute;
	height: 100%;	
	right: 0px;
	top: 0px;
}

div.TopLeftContent {
	background-repeat: no-repeat;
	position: absolute;
	top: 0px;	
	left: 0px;
}

div.TopRightContent {
	background-repeat: no-repeat;
	position: absolute;
	top: 0px;
	right: 0px;
}

div.BottomLeftContent {
	background-repeat: no-repeat;
	position: absolute;
	bottom: 0px;
	left: 0px;
}

div.BottomRightContent {
	background-repeat: no-repeat;
	position: absolute;
	bottom: 0px;	
	right: 0px;
}
/* Locale Switcher */

div.LocaleList {
	position: absolute;
	width: 100px;
	background-color: white;
	border: 1px solid #888888;
	margin: 0px;
	padding: 0px;
	z-index: 1;
}

div.LocaleList ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

div.LocaleList ul li {
	list-style-type: none;
	display: block;
	margin: 0px;
	padding: 2px;
	height: 20px;
	cursor: pointer;
	font-size: 12px;
}

div.LocaleList ul li:hover {
	background-color: #ffffbb;
}

div.LocaleList ul li span {
	position: relative;
	top: 3px;
}

div.LocaleList ul li a {
	color: inherit;
	text-decoration:none;
	display: block;
	width: 100%;	
	height: 100%;
	margin: -2px;
	padding: 2px;
}

div.LocaleList ul li img {
	float: right;
	margin-right: 4px;
}
/* Common Elements */

p, h3 {
	text-align: justify;
	font-family: "Helvetica", "Arial";
}

.BlueBox {
	background-color: #cbe2f1;
	border: 1px solid #89aeec;
	color: #1b56b9;
}

.GrayBox {
	border: 1px solid #999999;
	background-color: #f6f6f6;
}

div.Copyright {
	margin-top:25px;
	text-align: center;
	font-size: 10px;
}

p.Caption {
	font-size: 17px;	
}

a.Email {
	text-decoration: none;
	font-weight: bold;
	float: right;
	font-family: "Helvetica", "Arial";	
}

h3.Title {
	margin: 0px;
	padding: 0px 20px;
}

/* Layout */

/** General **/

body {
	margin: 0px;	
}

div#topRegion {
	background-image: url("http://images.shoopz.com/common/presentation-top-gradient.png");
	height: 25px;
	border-bottom: 2px solid black;
	padding-top: 25px;
}

div#topRegion img {

	margin-right: 1px;
}

div#topRegion .CenteredBlock {
	width: 1000px;
}

div#mainRegion {
	width: 1000px;
}

div#mainRegionContent {
	padding: 20px 0px;
}

div#contentPage {
	width: 970px;
	margin: 0px auto;
}

div#contentPageContent {	
	padding: 20px;
	background-color: white;
	text-align: center;
}

div#paddedRegion {
	padding: 0px 50px 0px 50px;
}

div#topRegionLocaleSwitcherArea {
	float: right;
	position: relative;
	z-index: 1; /* IE bug */
}

div#topRegionLocaleSwitcherArea > img {
	position: absolute;
	right: 12px;
	top: 4px;
}

/** Menus **/

div.MenuTitle img {
	display: block;
}

div.MenuTitle img.Hovered {
	display: none;
}

div.MenuTitle:hover img.Hovered {
	display: block;
}


div.MenuTitle:hover img {
	display: none;
}

div.Menu {
	padding: 5px 10px;
	background-color: #f6f6f6;	
	border: 1px solid black;
	border-top: 2px solid black;	
	position: absolute;
	min-width: 150px;
	z-index: 2;	
}

div.Menu img {
	display: inline !important;
}

div.MenuTitle:hover div.Menu {
	display: block;
}

div.MenuTitle div.Menu {
	display: none;
}

div.Menu:hover {
	display: block;
}

div.Menu a {
	text-decoration: none;
	margin-bottom: 6px;
	color: black;
	display: block;
	font-size: 13px;
}

div.Menu a:hover {
	font-weight: bold;
	color: #fc4a17;
}

/*** Locale Switcher ***/

div#topRegionLocaleSwitcherArea div.Menu {
	padding: 0px;
	border: none;
	min-width: 150px;
}

div#topRegionLocaleSwitcherArea div.LocaleList {
	border: 1px solid black;
	border-top: 2px solid black;	
	width: 128px;
}

#localeSwitcher {
	position: absolute;
	z-index: 3;
	right: 0px;
	top: 150px;
	font-size: 14px;
}

#localeSwitcher img {
	vertical-align: -6px;
	margin: 0px 4px;
}

#localeSwitcher a {
	text-decoration: underline;
	font-style: italic;
	font-size: 12px;
}

/* Main Presentation */

.BoxContainer {
	width: 675px;	
}

.BoxContainer .GrayBox {
	width: 250px;
	min-height: 80px;
	padding: 5px 15px 15px 15px;
}

.BoxTitle {
	background-image: url("http://images.shoopz.com/common/arrow-head.png");
	background-repeat: no-repeat;
	background-position: left;
	color: #fc4a17;
	font-weight: bold;
	font-size: 18px;
	padding-left: 20px;
}

.BoxContent {
	text-align: left;
	color: #202020;
	font-size: 12px;
	font-family: Helvetica, Arial, Sans-serif;
	margin-top: 10px;
}

blockquote {
	color: #999999;	
	font-family: "Trebuchet MS", Trebuchet, Helvetica, Arial;
	font-size: 20px;
	text-align: center;
	font-style: italic;
}

/* Shops */

#shopListContainer {
	text-align: left;
}

#shopListContainer .GrayBox {
	padding: 5px;
	margin-top: 3px;
}

/* Product Presentation */

div.Presentation a {
	color: #1b56b9;
	font-weight: bold;
	font-size: 13px;	
}

div.Presentation #featuresRegion {
	text-align: left;
	background-color: #f6f6f6;
	font-size: 12px;
	margin-top: 20px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 15px 15px 5px 0px;
	border: 1px solid #999999;	
}

div.Presentation #featuresRegion li {
	margin-bottom: 3px;
}

div.Presentation #featuresRegion .Caption {
	color: #fc4a17;
	font-size: 14px;
	font-weight: bold;
}

div.Presentation div#featuresRegionLeftArea {
	float: left;
	width: 420px;
}

div.Presentation div#featuresRegionRightArea {
	float: right;
	width: 420px;
}

/* FAQ */

#faqOverviewRegion {
	text-align: left;
	background-color: #f6f6f6;
	font-size: 12px;
	margin-top: 20px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 15px 5px 5px 5px;
}

#faqOverviewRegion a {
	color: #202020;
	text-decoration: none;
}

#faqOverviewRegion a:hover {
	color: #1b56b9;
}

div#faqOverviewRegionLeftArea {
	float: left;
	width: 420px;
}

div#faqOverviewRegionRightArea {
	float: right;
	width: 420px;
}

div.FaqSection {
	color: #fc4a17;
	font-size: 13px;
	font-weight: bold;
}

div#faqContentRegion {
	text-align: left;
	margin-bottom: 20px;
	padding: 0px 50px 0px 50px;	
}

div#faqContentRegion .Question {
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 5px;
	font-size: 13px;
	background-color: #cbe2f1;
	border: 1px solid #89aeec;
	color: #1b56b9;
	font-weight: bold;
	font-family: "Trebuchet MS", Trebuchet, Helvetica, Arial;		
}

div#faqContentRegion .Answer {
	margin-left: 15px;
	color: #666666;
	font-size: 14px;	
	font-family: "Helvetica", "Arial";	
}

/* Company About */

div#shoopzTechnologyPanel {
	text-align: justify;
	color: #666666;	
	font-family: "Trebuchet MS", Trebuchet, Helvetica, Arial;
	font-size: 12px;
	width: 250px;
	float: right;
	padding: 10px;
	background-color: #f6f6f6;
	border: 1px solid #999999;
	margin-right: 50px;
}

div#shoopzTechnologyPanel div + div {
	margin-top: 10px;
}

div#shoopzTeam {
	text-align: justify;
	font-size: 14px;
	width: 380px;
}

/* Company Services */

p.Information {
	color: #202020;	
	padding: 10px;
}

.Services p.Center {
	color: #666666;
}

/* Contact Page  */

.Contact p {
	font-size: 14px;
}

.Contact p.Caption {
	font-size: 17px;
}

.Contact a.Email {
	font-size: 16px;
}

.Contact p.GrayBox {
	color: #202020;
}

.PaddedBox {
	padding: 10px;
}

/* Terms of Service */

div#paddedRegion.ServiceTerms {
	text-align: left;
}

/* Generated Customizable Blocks */

#mainRegion {
	padding-bottom: 8px;
}

#mainRegion > div.Relative > .InnerContent {
	width: 984px;
	left: 8px;
	background-color: #f6f6f6;
	padding: 0px 0px 0px 0px;
}

#mainRegion > div.Relative > .LeftContent {
	width: 8px;
	background-color: #f6f6f6;
}

#mainRegion > div.Relative > .RightContent {
	width: 8px;
	background-color: #f6f6f6;
}

#mainRegion > div.Relative > .BottomContent {
	height: 8px;
	width: 984px;
	bottom: -8px;	
	left: 8px;
	background-color: #f6f6f6;
}


#mainRegion > div.Relative > .BottomLeftContent {
	background-image: url("http://images.shoopz.com/common/generated/presentation-main-region-rounded-corner-bottom-left.png");
	height: 8px;
	bottom: -8px;	
	width: 8px;
}

#mainRegion > div.Relative > .BottomRightContent {
	background-image: url("http://images.shoopz.com/common/generated/presentation-main-region-rounded-corner-bottom-right.png");
	height: 8px;
	bottom: -8px;	
	width: 8px;
}

#contentPage > div.Relative > .InnerContent {
	width: 946px;
	left: 12px;
}

#contentPage > div.Relative > .TopContent {
	height: 12px;
	width: 946px;	
	top: -12px;
	left: 12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-top.png");
}

#contentPage > div.Relative > .LeftContent {
	width: 12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-left.png");
}

#contentPage > div.Relative > .RightContent {
	width: 12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-right.png");
}

#contentPage > div.Relative > .BottomContent {
	height: 12px;
	width: 946px;	
	bottom: -12px;
	left: 12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-bottom.png");
}

#contentPage > div.Relative > .TopLeftContent {
	top: -12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-top-left.png");
	height: 12px;
	width: 12px;
}

#contentPage > div.Relative > .TopRightContent {
	top: -12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-top-right.png");
	height: 12px;
	width: 12px;
}

#contentPage > div.Relative > .BottomLeftContent {
	bottom: -12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-bottom-left.png");
	height: 12px;
	width: 12px;
}

#contentPage > div.Relative > .BottomRightContent {
	bottom: -12px;
	background-image: url("http://images.shoopz.com/common/generated/presentation-content-page-shadows-bottom-right.png");
	height: 12px;
	width: 12px;
}

/* Unsupported Browser */

#unsupportedBrowser {
	width: 700px;
	margin: 20px auto;
	border: 1px solid #999999;
	padding: 30px 50px;
}

#unsupportedBrowser a {
	color: #e24800;
}

a#ignoreUnsupportedBrowser {
	color: #0d82b8;	
}

#unsupportedBrowser h3 {
	margin-bottom: 35px;
	color: #006ae2;
}

#supportedBrowsers {
	margin-left: 50px;
}

#supportedBrowsers div.BrowserContainer {
	height: 90px;
}

#supportedBrowsers img {
	float: left;
	margin-right: 20px;
}

#supportedBrowsers span {
	font-size: 12px;
	color: #777777;
	font-weight: bold;
}