/* CSS for MyHarmony Mac Screen for plugins  */

html, body{background-color: #CCC; font-family: Arial; font-size: 13px; line-height: 1.2}

#container {
	width: 975px;
	min-width: 975px; 
	margin: 0 auto;
	padding: 20px;
	background-color: #F3F3F3
}

#container .show {display: block;}
#container .hide {display: none;}

#container h1{font-size: 18px; font-weight: bold;}

#container p{font-size: 14px;}

#container .bold{font-weight: bold;}

#container .marginLeft13{margin-left: 13px}

#container .fineText{font-size: 11px}

#container .stepsContainer{
	width: 942px;
	height: 50px;
	margin-left: 13px;
	border-radius: 4px;
	-moz-border-radius: 4px
	-webkit-border-radius: 4px;
	border: 1px solid #CCC;
}

#container .stepsContainerBG{
	background: url(../Images/MacPluginScreen/normal_bg.png) left top repeat-x;
}
#container .stepHeading{font-size: 15px}

#container .step1of3, #container .step2of3 {
	width: 314px; 
	height: 50px;
	line-height: 50px;
	float: left;
	display: table-cell; background: url(../Images/MacPluginScreen/normal_bg.png) left top repeat-x;
	text-align: center; 
	vertical-align: middle;
}

#container .step3of3 {
	width: 313px; 
	height: 50px;
	float: right; 
	text-align: center; 
	vertical-align: middle;
	line-height: 50px;
}

#container .step3of3-tweak-width{
	width: 312px; 
	height: 50px;
	float: right; 
	text-align: center; 
	vertical-align: middle;
	line-height: 50px;
}

#container .step1of2, #container .step2of2 {
	width:471px; 
	height: 50px;
	float: left; 
	text-align: center; 
	vertical-align: middle;
	line-height: 50px;
}

#container .step1of4, #container .step2of4, #container .step3of4, #container .step4of4 {
	width:235px; 
	height: 50px;
	float: left; 
	text-align: center; 
	vertical-align: middle;
	line-height: 50px;
}

#container .currentStep {
	height:50px; 
	background: url(../Images/MacPluginScreen/selected_bg.png) left top repeat-x;
}
#container .normalStep {
	height:50px; 
	background: url(../Images/MacPluginScreen/normal_bg.png) left top repeat-x;
	color:#A2A0A1;
}

#container .completedStepTextColor {color:#000}

#container .tickImageDiv {
	float:left; 
	margin-top:11px; 
	margin-left:7px
}

#container .borderRight {border-right: 1px solid #CCC}
#container .borderLeft {border-left: 1px solid #CCC}

#container .stepShadowRight {
	height:50px; 
	width: 100%; 
	background: url(../Images/MacPluginScreen/shadow_right.png) left top no-repeat; 
	text-align: center; 
	vertical-align: middle;
}
#container .stepShadowLeft {
	height:50px; 
	width: 100%; 
	background: url(../Images/MacPluginScreen/shadow_left.png) left top no-repeat; 
	text-align: center; 
	vertical-align: middle;
}

#container .stepContentBG {height:391px; width: 972px; background: url(../Images/MacPluginScreen/content_main-bg.png) left top no-repeat;}

#container .clearFloat {clear: both;}

#container .contentContainer{
	width: 942px;
	padding:70px 10px 0 10px;
}
#container .content1of3, #container .content2of3 {
	width: 314px; 
	float: left;
}

#container .content3of3 {
	width: 313px; 
	float: left;
}

#container .content1of2, #container .content2of2 {
	width:471px; 
	float: left; 
}

#container .paddingRight10{padding-right: 10px;}
#container .paddingRightLeft10{padding-right: 15px; padding-left: 10px;}

#container a:link.buttonLabel{text-decoration: none; color: #000}
#container a:visited.buttonLabel{text-decoration: none; color: #000}
#container a:hover.buttonLabel{text-decoration: none; color: #000}
#container a:active.buttonLabel{text-decoration: none; color: #000}

#container a:link.popupLink{text-decoration: none; color: #0389C9}
#container a:visited.popupLink{text-decoration: none; color: #0389C9}
#container a:hover.popupLink{text-decoration: underline; color: #0389C9}
#container a:active.popupLink{text-decoration: none; color: #0389C9}

#container #autoAdvanceDiv {margin-top:-10px; width: 940px;margin-left: 13px;}
#container #autoAdvanceText.red {color:#F00}

/* Button CSS Starts */

#container .btnClass{

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border:1px solid #b3b3b3;

	/* Prevent background color leak outs */
  	-webkit-background-clip: padding-box; 
  	-moz-background-clip: padding; 
  	background-clip: padding-box;

  	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #eeeaee 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#eeeaee)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#eeeaee 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#eeeaee 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#eeeaee 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#eeeaee 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeaee',GradientType=0 ); /* IE6-9 */

	-webkit-box-shadow:  1px 1px 1px 1px #B2DDF2;
	-moz-box-shadow:  1px 1px 1px 1px #B2DDF2;
    box-shadow:  1px 1px 1px 1px #B2DDF2;

    line-height: 25px;
    width:auto;
    cursor: pointer;
    display: inline-block
}

.buttonDiv{
	width: 95%;
	text-align: center;
	padding-top: 10px
}
.buttonContainer{}

/* Button CSS Ends */

#container .stepContentBG-2 {height:482px; width: 972px; background: url(../Images/MacPluginScreen/content_main-bg_2.png) left top no-repeat;}

#container .helpLinkDiv{
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border:1px solid #CDD9D7;
	width: 922px;
	padding:10px;
	margin-left: 12px;
	background-color: #F8F8F8;
}

#container ol li.paddingBottom {padding-bottom:8px}
#container ol li.last {margin-bottom:-17px}

/* START: CSS for Content Not Support Page */

div#control_area_notSupported {font-size:1.2em}
div#control_area_notSupported .hide{display:none}
div#control_area_notSupported .bold{font-weight:bold}
div#control_area_notSupported .alignLeft{text-align:left}
div#control_area_notSupported .alignCenter{text-align:center}
div#control_area_notSupported .alignVerticalMiddle{vertical-align:middle}
div#control_area_notSupported table th.bg {background-color:#06BBBE; height:25px}
div#control_area_notSupported table th.big {width:280px}
div#control_area_notSupported table th.small {width:100px}
div#control_area_notSupported table tr td {padding:5px}
div#control_area_notSupported div#notes p {padding-bottom:10px}
div#control_area_notSupported .topMargin {margin-top:50px}
div#control_area_notSupported .sepRightPadding {padding-right:10px}
div#control_area_notSupported div.imgText{display:table-cell; margin:0 auto}
div#control_area_notSupported div.imgText div.img{float:left;}
div#control_area_notSupported div.imgText div.txt{float:left; padding:3px 0 0 5px}
 
/* END: CSS for Content Not Support Page */