/*standard plus html5 specific resets*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
	/*line-height:1.3em;*/
}

article, aside, figure, footer, header, hgroup, nav, section
{
    display: block;
}

img, object, embed
{
    max-width: 90%;
}

/*end resets*/

.cf:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.cf {
	min-height: 1px;
}

* html .cf {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/*setting default font size so that 1 em will approximately equal 10 pixels and so that we can use media queries to scale the fonts*/
body
{
    height:100%;
    font-size: 62.5%;
    overflow: hidden;
}

button
{
    /*button is a special case and gets a default font size from the browser so we reset it to the same font-size as it's parent container*/
    font-size: 1em;
}

img, object, embed {
    display: block;
    margin:0 0 1em;
}

p {
    margin: 0 0 1em;
    line-height: 1.7em;
}

ul {
    margin: 0 0 1em;
}

ul.noBullets {
    list-style-type: none;
}

li {
    line-height: 1.7em;
}
/*
h3
{
    font-size: 120%;
    line-height: 1.5em;
}
*/
h3{
    margin: 10px 0 10px;
    font-size: 140%;
    color: rgba(234,60,60,0.8);
    line-height: 1.3em;
}
h3 span{
    font-size: 62%;
    font-weight: normal;
	color:#CCC;
}
h3 img {
        display: inline-block;
        margin: 0;
    }
h4{
	color:#f0ad2c!important;
}
a
{
  text-decoration: none;
}

a:link, a:visited, a:hover, a:active {
    color: #DDC071;
}

article
{
    overflow: hidden;
}

.articles article
{
    margin-top: 0;
    display: none;
}

.contentPanel li
{
    list-style-type: none;
}

article
{
    position: relative;
}

.menuLink {} /* marker class for links to menu pages */
.contentLink {} /* marker class for content pages */

.contentPanel
{
    width: 388px;
    height: 900px;
    color: #ebebeb;
    float: left;
    padding: 64px 28px 64px 64px;
    vertical-align: top;
    font-size:2.4em;
    background-repeat:  repeat-y;
    background-image: url("img_common/bg/side_main_tablet.png");
}

.helpContent
{
    height: 794px;
    overflow: hidden;
    background-color: transparent;
    padding: 136px 64px 64px 64px;
    -moz-column-count: auto; /* Firefox - SmartGlass and console do not need these -moz-XXXX, but if help rendered on regular desktop it could be FF */
    -webkit-column-count: auto; /* Safari and Chrome */
    column-count: auto;
    -moz-column-width: 344px;
    -webkit-column-width: 344px;
    column-width: 344px;
    -moz-column-gap: 80px; /* Firefox */
    -webkit-column-gap: 80px; /* Safari and Chrome */
    column-gap: 80px;
    /*without this property the columns will always try to have the same amount of content each. 
    Using auto if you set the height it will only fill as needed*/
    -webkit-column-fill: auto;
    -moz-column-fill: auto;
    column-fill: auto;
    font-size:2.0em;
    line-height:1.5;
    position: relative;
}
.contentPanel .articleTitle
{
    clear: both;
    font-family: Segoe UI Light, Segoe UI Regular,HelveticaNeue, Droid Sans, Arial, Sans-Serif;
    font-weight: 100;
    font-size:1.5em;
    margin-top:10px;
     margin-bottom:32px;
}
.contentPanel .articleTopic
{
    font-family: Segoe UI Regular,HelveticaNeue, Droid Sans, Arial, Sans-Serif;
    font-weight: normal;
    /*Because we reset font family here we have to also reset the size or it will get the default body font size. 1em here means the same as it's parent*/
    font-size:0.9em;
	line-height: 1em;
   
}
.panelRule
{
    color: #ebebeb;
}

.panelButtons
{
    /*if there are additional buttons or other elements in the panel you'll need to adjust this value*/
    margin-top: 680px;
    margin-left: 28px;
}

/**********button state formats***********/

.navLinks li:first-child a 
{
    border-top:solid 2px #750200;
}
.navLinks a 
{
    border-bottom:solid 2px #750200;
    /*border-bottom:solid 2px #ebebeb;*/
    background-color: rgba(235, 235, 235, 0); 
    width: 432px;
    height: 108px; /*height 108px is the value that includes the focused border.*/
    outline: 2px solid rgba(235, 235, 235, 0);
    line-height: 2.4em;
    padding: 36px 0 0 18px;
}
.navLinks a:focus,.pageButton:focus
{
    background-color: rgba(210, 4, 0, 0.3);
    outline-color:  rgba(210, 4, 0, 0.6);
    border-color:rgba(210, 4, 0, 0);
}
/*
.pageButton:focus
{
    background-color: rgba(235, 235, 235, 0.1); 
    outline-color: rgba(235, 235, 235, 1); 
    border-color:rgba(235, 235, 235, 0); 
}
*/
.navLinks a:hover:not(:focus)
{
    width: 100%;
    /*background-color: transparent;*/
    background-color: rgba(210, 4, 0, 0.2);
    /*outline: solid 2px rgb(107, 107, 107);*/
    /*border-left:solid 2px #cf8b38 ;*/
    /*border-bottom:solid 2px  #cf8b38;*/
    /*border-bottom:solid 2px transparent; */
}

.pageButton
{
    height: 90px;
    color: #ebebeb;  
    text-align: left;
    line-height: 140px;
    width: 178px;
    margin: 0 10px 0 0;
    -ms-attraction: 0% 0% 0% 0%;
    border: 1px solid #ebebeb;
    background-color: rgba(54, 146, 217, 0.2);
    outline: 4px solid rgba(235, 235, 235, 0);   
}

 .pageButton:hover:not(:focus) 
 {
    background-color: transparent;
    outline: solid 4px rgb(107, 107, 107); 
    border:none;
 }

.pageButton.next
{
   line-height: 46px;
   float: right;
}

.panelButtons .pageCounter 
{
   display:block;
   height:2em;
   overflow:hidden;
}

.pageCounter
{
   display:none;
}

.win-voice-activelistening .pageCounter
{
   display:none;
}

 .pageButton.previous
 {
    float: left;
 }
/*
.contentPanel .backLink{
    background: transparent url(left_arrow.png) no-repeat 0px 0px;
    display:block;
    height: 2.5em;
    width: 2.5em;
    margin-left: 10px;
    background-size:90%;
    font-size:1em;
    float:left;
}
.contentPanel .backLink:hover
 {
    background-color: transparent;
}
.contentPanel .backLink:focus
 {
    background: transparent url(left_arrow_hoverFocus.png) no-repeat 0px 0px;
}*/
.contentPanel .backLink
{
    background: transparent url(left_arrow.png) no-repeat 28px 62px;
    display: block;
    height: 5.1em;
    width: 5.1em;
    margin: -60px 0 0 -24px;
    background-size: 49%;
    font-size:1em;
}

.contentPanel .backLink:hover
 {
    background-color: transparent;
 }

.contentPanel .backLink:focus
 {
    background: transparent url(left_arrow_hoverFocus.png) no-repeat 28px 62px;
    background-size: 49%;
    outline:0;
 }

.contentPanel .tocLink{
    background: transparent url(img_common/ico/home_arrow.png) no-repeat  0px 0px!important;
    background-size:100%;
}
.contentPanel .tocLink:hover
 {
    background-color: transparent;
 }

.contentPanel .tocLink:focus
 {
    background: transparent url(img_common/ico/home_hoverFocus.png) no-repeat  0px 0px!important;
    background-size: 100%;
    /*outline:0;*/
 }
.contentPanel a
{
   display: inline;
   line-height: 1;
   color: #ebebeb;
   -ms-attraction: 0% 0% 0% 0%;
}
.breadcrumb {
    width: 100%;
}
.helpMenu ul:not(.breadcrumb) a
{
    height:4em;
    width: 100%;
    display: block;
    line-height: 4em;
    margin:0 0 0 -59px;
    padding:0 25px 0 56px;
    -ms-attraction: 0% 0% 0% 0%;
}
.endMark
{
    /*this empty element is given a width so that it will stretch to fill the last column as needed*/
    visibility: hidden;
    display: block;
    height: 1px;
    width: 100%;
    break-before: column;
}

/*note that we use absolute postitioning here instead of static so we reset the margin to 0*/
article .contentPanel .panelButtons
{
    position: absolute;
    margin: 0;
    bottom: 44px; /* safe region area */
    left: 64px; /* safe region area on the left: 64px */
    width: 386px;
}

/* The following styles are only applied when voice commands are in use on the console */
.win-voice-activelistening[data-win-voice]
{
    color: green;
}

/* Force column break before/after element. Use to keep content "grouped," such as pictures with text. */

.subHeader{
    
}
.breakBefore {
    break-before: column;
    -webkit-column-break-before: column;
    -moz-column-break-before: column;
    -ms-column-break-before: column;
    -o-column-break-before: column;
}
.breakAfter {
    break-after: column;
    -webkit-column-break-after: always;
    -moz-column-break-after: column;
    -ms-column-break-after: column;
    -o-column-break-after: column;
}
.breakAfter-al{
    break-after: always;
    -webkit-column-break-after: always;
    -moz-column-break-after: always;
    -ms-column-break-after: always;
    -o-column-break-after: always;
}
/*
.breakAfter p,.breakAfter-al p{
	line-heigth: 1.3em!important;
}
*/
/* BACKGROUNDS */
#TOC {
    background-image: url(img_common/bg/bg_main_tablet.jpg);
    background-color: #000;
	background-repeat: no-repeat;
	/*background-size: 100% auto;*/
}
#article1000{
    background-image: url(img_common/bg/bg_10_tablet.jpg);
    background-color: #000;
	background-repeat: no-repeat;
	/*background-size: 100% auto;*/
}
#article2000{
    background-image: url(img_common/bg/bg_20_tablet.jpg);
    background-color: #000;
	background-repeat: no-repeat;
	/*background-size: 100% auto;*/
}
#article9000{
    background-image: url(img_common/bg/bg_90_tablet.jpg);
    background-color: #000;
	background-repeat: no-repeat;
	/*background-size: 100% auto;*/
}
/* contents */
.ty{
    color: #a88541;
}
.tw{
    color: #f0f0f0;
}
.whiteDown{
	color: #969696;
}
.captionHead {
	line-height: 1.5em;
	margin-top: 0;
	margin-bottom: 35px;
}
.captionHead span{
	font-size: 60%;
	line-height: 1em!important;
	font-weight:normal;
	color:#CCC;
}
.headCaption {
    font-size: 95%;
	line-height: 1.8em;
    color:  rgb(204, 204, 204);
    border: solid 2px rgb(125, 125, 125);
    font-weight: nomal;
    padding:  10px 15px;
    margin:10px 0 20px 0;
}
.headCaption span{
}
.listBlocks{
    border: solid 2px rgb(125, 125, 125);
    padding:  10px 15px;
	font-size: 80%;
}
.listBlocks .listHeader{
	color:#f0ad2c!important;
	margin-left: 10px;
}
.packList{
	width:  90%;
	margin: 0 auto;
}
.packList li{
	width:  50%;
	margin: 0;
	list-style:none;
	float:left;
}
.packList li p{
	width:  90%;
	margin: 0 auto;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;	
}
.clair{
	background-color:#901c1c;
}
.bally{
	background-color:#998328;
}
.boxBlock{
	clear:both;
	border: 3px solid #333;
	margin: 0 4px;
}
.boxBlock h3{
	font-size: 102%;
	background-color: rgba(34,34,34,0.5);
	padding: 5px 5px 0;
}
.boxBlock p{
	padding: 5px;
}
.boxBlock img {
	float:left; 
	margin: 0 ; 
	padding: 5px;
}
.noBullets li{
	margin: 10px 0;
}
.keyInfo{
	margin:0 0 5px 45px;
	line-height: 1.3em;
}
.cnt1000 h4{
    color: #e0e0e0;
    font-size: 100%;
    border-top: 1px solid #df9973 ;
    border-bottom: 1px solid #df9973 ;
    background-color: rgba(131,26,26,0.5);
    text-align: center;
    padding: 10px 0;
}
.cnt1000 .blocks{
    background-color: rgba(57,10,10,0.2);
    border: 1px solid  #412823;
    text-align: center;
}
.cnt1000 .subBlock{
    width: 95%;
    margin: 3px auto;
    background-color: rgba(31,15,5,1);
    border: 1px solid  #412823;
    line-height: 0.9em;
    padding: 10px 0;
}
.subBlock p{
	padding: 0;	
	margin: 0;
}
.cnt1000 .subBlock img{
    margin-top: 5px;
	margin-bottom: 2px;
    width: 90%;   
}
.cnt1000 .subBlock span{
    font-size: 70%;
}
.cnt2000 li{
	list-style: none;
}
.cnt2000 img{
	margin-top: 5px;
}
.cnt9000 .blockText{
	border: 2px solid #930;
	background-color: rgba(175,44,44,0.3);
	padding: 3px 0 0 0;
	margin: 10px 0;
	font-size: 95%;
	word-wrap: break-word;
}
.cnt9000 .blockText h4{
	font-size: 100%;
}
.cnt9000 .blockText img{
	margin: 5px auto;
}
.cnt9000 .tc{
	text-align: center;
}
.cnt9000 .textTel-l{
	font-size: 140%;
	margin: 0;
}
.cnt9000 .textTel-s{
	line-height: 1.2em;

}
.cnt9000 p{
	line-height: 1.5em;
}