/*
// ------------------------------------
// App-specific settings
// ------------------------------------
*/

/* This style is used by the AcgApp.isEnanced() method to determine if we are using the enhanced stylesheet */
body:after
{
	content:'default';
	display:none;
}

body
{
    max-width: 100%;
    overflow-x: hidden;	/* Causes Chrome to add a vertical scrollbar */
}

#cssCheck
{
	font-weight:800;
}

.defaultMode
{
	display: block;
}
table.defaultMode
{
	display: table;
}
.enhancedMode
{
	display: none;
}
table.enhancedMode
{
	display: none;
}
.enhancedModeTableCell
{
	display:none;
}
.enhancedModeInlineBlock
{
	display:none;
}

.myButton
{
	cursor:hand;
	cursor:pointer;
}

.myLink
{
	text-decoration:underline;
}

.myRoundButton
{
	display:inline-block;
	font-size:1em;
	
	cursor:hand;
	cursor:pointer;
	
	border: 2px solid #004281;
	background-color:#004281;
	color:#ffffff;
	
	padding:0em 1em 0.1em 1em;

/*
	-webkit-border-radius: 0.4em;
	-moz-border-radius: 0.4em;
	border-radius: 0.4em;
*/
	
	text-decoration:none;
	
}
.myRoundButton.selected
{
	background-color:#ffffff;
	color:#0171c5;
	text-decoration:none;
	pointer-events: none;
	cursor: default;
}

.myHeaderButton
{
	jdisplay:table-cell;
	display:inline-block;
	font-size:1.2em;
	pointer-events:auto;
	
	vertical-align:middle;
	
	height:2.5em;
	min-height:40px;
	
	border: 1px solid #0099e0;
	jborder: 1px solid #00ff00;
	jborder-top:1px solid #ffffff;
	jborder-left:1px solid #ffffff;
	jborder-right:1px solid #034287;
	border-right:1px solid #009ce3;
	border-bottom:1px solid #009ce3;
		
	background-color:#0088d5;
	color:#ffffff;
	text-align:center;
	
	font-smooth:always;
	-webkit-font-smoothing: antialiased;
	
/*
	padding-left:0.5em;
	padding-right:0.5em;
	padding-top:1em;
	padding-bottom:1em;
	margin-bottom:0px;
*/
	
	jmin-width:33.3%;
	jwidth:1%;			/* not sure why this works */
	
	cursor:hand;
	cursor:pointer;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.myHeaderButton:hover
{
	background-color:#005f98;
}

.mySelectedHeaderButton, .mySelectedHeaderButton:hover
{
	background-color: rgb(0,174,239);
}

.borderBox
{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.outerArea
{
	jbackground-color:#cccccc;
	jpadding:2em 0em;
	jheight:100%;
	jtext-align:center;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;
}

.innerArea
{
/*	display:inline-block; */	/* Why inline? Doing so causes vertical whitespace between innerArea sections */
	jmax-width:1612px;
	jmax-width:960px;
	jbackground-color:rgb(247,247,247);
	width:100%;
	margin:auto;
	
	j-webkit-box-sizing: border-box;
	j-moz-box-sizing: border-box; 
	box-sizing: border-box;
	
	padding:0em 1em;
}

.startHidden
{
	visibility:hidden;
}

.noScript
{
	padding-top:1em;
	width:960px;
	margin:auto;
	color:#000000;	
}

#preloadContent
{
	padding-top:2em;
	text-align:center;
}

#scriptContent
{
	background-color:#ffffff;
	color:#444444;
}

.headerBand
{
	border-bottom:1px solid rgb(0,174,234);
	jfont-size:2.5em;
}

.title
{
	font-size:1.1em;
	font-weight:100;
	color:rgb(88,88,88);
	line-height:0.8;
}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
    height: 7px;
}
::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0,0,0,.5);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

.detailsTitle
{
	font-weight:bold;
	text-align:left;
	margin-top:0.5em;
	font-size:1.25em;
}

.detailsText
{
	text-align:left;
	font-size:1em;
	jline-height:1.5;
}

.detailsFeaturedProduct
{
	font-size:1.2em;
	font-weight:bold;
}
.detailsFeaturedProductLabel
{
	font-size:1.2em;
}
.detailsItems
{
	border-radius:5px;
	background-color:white;
	border:3px solid rgb(150,150,150);
	color:rgb(0,0,0);
	padding:1em;
}

/* disable focus */
canvas:focus
{
	outline:none;
}

#osdui
{
	position:absolute;
	right:1em;
	bottom:1em;
	z-index:1;
	width:41px;
}
#osdui2
{
	position:absolute;
	right:0;
	top:0;
	z-index:1;
	width:22px;
	height:50px;
}
.subheaderButton
{
	border:3px solid rgb(125,125,125);
	background-color:rgb(149,149,149);
	color:white;
	jpadding:0.2em 1em;
	border-radius:5px;
	font-size:1em;
	jtext-transform:uppercase;
	margin-left:2em;
	min-width:10em;
	display:inline-block;
}
#openseadragon1
{
	jwidth:calc(100% - 400px);
	width:100%;
	jmargin-left:400px;
	height: 600px;
	background-color:rgb(245,245,245);
	display:inline-block;
	position:relative;
}

#menucontainer
{
	display:inline-block;
	position:absolute;		/* are we doing this to make sure the layer stays on top? */
	box-sizing:border-box;
	z-index:9999999;
	overflow:hidden;
	overflow-y:scroll;
	background-color:rgb(255,255,255);
}
#menu
{
	display:inline-block;
	jwidth:400px;
	jheight:600px;
	jfloat:left;
	position:absolute;
	jbackground-color:rgb(20,86,121);
	jbackground-color:rgb(9,40,57);
	jbackground-color:rgb(35,155,216);
	background-color:rgb(230,230,230);
	jbackground-image:url('../images/menuBackground.png');
	color:rgb(255,255,255);
	jpadding-left:1em;
	jpadding-right:1em;
	box-sizing:border-box;
	joverflow:auto;
	j-webkit-overflow-scrolling:touch;
	joverflow-x:hidden;
	z-index:999999;
	overflow:hidden;	/* needed to remove space at bottom of menu between menu and menucontainer */
}
#startTabContent
{
	background-color:rgb(35,155,216);
}
#bucTabContent
{
	background-color:rgb(18,79,114);
}
#applicationsTabContent
{
	background-color:rgb(110,190,74);
}
#securityTabContent
{
	background-color:rgb(47,47,47);
}
#productsTabContent
{
	background-color:rgb(132,132,132);
}

.acgImageButton
{
	cursor:hand;
	cursor:pointer;
}
.contentAreaHeight
{
	box-sizing:border-box;
}

.myTabs
{
	float:left;
	width:42px;
	background-color:rgb(230,230,230);
	padding-left:9px;	
	box-sizing:border-box;
}
.menuSectionTitle
{
	padding-left:1em;
	padding-right:1em;
	jfont-size:1.1em;
	font-weight:bold;
}
.menuSectionText
{
	padding-left:1em;
	padding-right:1em;
}
.menuCheckbox
{
	position:relative;
	top:2px;
}
.menuSectionSeparator
{
	padding-left:1em;
	padding-right:1em;
	margin-bottom:1em;
}
.acgTabContent
{
	jmargin-top:1em;
	padding-top:1em;
	jmargin-left:42px;
	jwidth:calc(100% - 42px);
	width:100%;
	box-sizing:border-box;
/* We don't use padding here because we want some items (like the item-hover) to show edge-to-edge */
/*
	padding-left:1em;
	padding-right:1em;
*/
}
#closePopup
{
	cursor:hand;
	cursor:pointer;
}

.pretty
{
	position:relative;
    white-space:normal;
    width: 14rem;
}
.pretty input
{
	position:absolute;
	left:0;
	top:0;
	margin-top:1px;
}
.pretty label
{
	display:inline-block;
    text-indent: 0;
    padding-left:1.5em;
}
.pretty label:before, .pretty label:after
{
	top:0;
}
#contentArea
{
	background-color:rgb(247,247,247);
}
.readMoreLink, .readLessLink
{
	font-size:0.75em;
	text-transform:uppercase;
	
	cursor:hand;
	cursor:pointer;
}
.readMoreLinkContainer, .readLessLinkContainer
{
	padding-top:1em;
}
.overviewText
{
	margin-top:0.25em;
}

.viewportOverlay
{
	display:none;
	position:absolute;
	background-color:rgba(0,0,0,0.8);
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:1;
}