/*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;
}
article, aside, figure, footer, header, hgroup, nav, section {
	display: block;
}
img, object, embed {
	max-width: 100%;
}
/*end resets*/

/*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;
}
a {
	text-decoration: none;
}
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: 95%;
	background-color: #222222;
	color: #ebebeb;
	float: left;
	padding: 54px 17px 0px 20px;
	vertical-align: top;
	font-size: 2.4em;
	overflow-x: hidden !important;
	-ms-overflow-x: hidden !important;
}
.helpContent {
	height: 730px; /* was 794 */
	overflow: hidden;
 	/*background-color: #282828*/;
	padding: 104px 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: 26em;
	-webkit-column-width: 26em;
	column-width: 17em; /*26em*/
	-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: balance;
	-moz-column-fill: balance;
	column-fill: balance;
	font-size: 2.4em;
	line-height: 1.5;
	position: relative;
	margin: 0 60px 0 0;
}
.contentPanel .articleTitle {
	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: 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 a {
	/* border-bottom:solid 4px #ebebeb;*/
	background-color: rgba(235, 235, 235, 0);
	width: 432px;
	height: 108px; /*height 108px is the value that includes the focused border.*/
	outline: 4px solid rgba(235, 235, 235, 0);
	line-height: 2.4em;
	padding: 36px 0 0 18px;
}
.navLinks a:focus, .pageButton:focus {
	background-color: #02b1f4 !important;
	outline-color: rgba(235, 235, 235, 1);
	border-color: rgba(235, 235, 235, 0);
}
.navLinks a:hover:not(:focus) {
	background-color: #02b1f4;
	outline: solid 4px transparent;
	border-bottom: solid 4px transparent;
}
.pageButton {
	height: 90px;
	color: #ebebeb;
	text-align: left;
	line-height: 140px;
	width: 178px;
	margin: 0;
	padding: 0;
	-ms-attraction: 0% 0% 0% 0%;
	border: 1px solid #ebebeb;
	background-color: rgba(235, 235, 235, 0);
	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;
	text-align: right;
	margin-right: 48px;
	padding: 0px 10px 5px 0;
}
.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 62px;
	display: block;
	height: 4.1em;
	width: 3.1em;
	margin: -32px 0 0 0px;
	background-size: 45%; /* 49% */
	font-size: 1em;
}
.contentPanel .backLink:hover {
	background-color: transparent;
}
.contentPanel .backLink:focus {
	background: transparent url(left_arrow_hoverFocus.png) no-repeat 0px 62px;
	background-size: 45%;
	outline: 0;
}
.contentPanel a {
	display: inline;
	line-height: 1;
	color: #ebebeb;
	-ms-attraction: 0% 0% 0% 0%;
}
.helpMenu li a {
	color: #ebebeb;
	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: 21px; /* safe region area on the left: 64px */
	width: 100% /*386px*/;
}
/* The following styles are only applied when voice commands are in use on the console */
.win-voice-activelistening[data-win-voice] {
	color: green;
}
.extra-content-container {
	position: absolute;
	display: block;
	left: 0;
	width: 100%; /*408px*/
	bottom: 0px;
	text-align: center;
	line-height: 63px;
	background-color: #02b1f4;
	color: white;
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 22px;
	text-transform: uppercase;
}
/********************* menu icons *******************/

.m-ico-freedrive {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/freedrive.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-drive {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/drive.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-social {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/social.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-smartphone {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/smartphone.png") no-repeat 0px 6px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-skill-challenges {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/skill-challenge.png") no-repeat 0px 6px;
	display: block;
	float: left;
	margin: 5px 5px 0px 0px;
	clear: both;
}
.m-ico-mission-challenges {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/mission-challenge.png") no-repeat 0px 4px;
	display: block;
	float: left;
	margin: 8px 5px 0px 0px;
	clear: both;
}
.m-ico-explore {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/exploration.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-economy {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/economy.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-cars {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/cars.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-perks {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/perks.png") no-repeat 0px 5px;
	display: block;
	float: left;
	margin: 7px 5px 0px 0px;
	clear: both;
}
.m-ico-controls {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/controls.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
.m-ico-uplay-supp {
	width: 50px;
	height: 50px;
	background: url("images/menu-icons/uplay.png") no-repeat 0px 8px;
	display: block;
	float: left;
	margin: 4px 5px 0px 0px;
	clear: both;
}
/************************** Controls  ************/

.dPadImage_up {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/xbox/x360_Dpad_up.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.dPadImage_down {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/xbox/x360_Dpad_down.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.dPadImage_left {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/xbox/x360_Dpad_left.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.dPadImage_right {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/xbox/x360_Dpad_right.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.dPadImage_l-r {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/xbox/x360_Dpad_L-R.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.leftStickImage_r {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/white/x360_LS.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.rightStickImage_r {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/white/x360_RS.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.rightStickImage_r.stroke {
	background: url("images/controll-stroke/x360_RS-stroke.png") no-repeat 0px -5px;
	}

.rightStickImage_up {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/white/x360_RS-up.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.rightStickImage_down {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/white/x360_RS-down.png") no-repeat 0px -5px;
	vertical-align: middle;
}
.xb_buttonImage_b {
	display: inline-block;
	width: 40px;
	height: 37px;
	background-size: 100% !important;
	background: url("images/white/x360_B.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.xb_buttonImage_b.stroke {
	background: url("images/controll-stroke/x360_B-stroke.png") no-repeat 0px -5px;
	}

.leftBumperImage_lb {
	display: inline-block;
	width: 45px;
	height: 34px;
	background-size: 85% !important;
	background: url("images/white/x360_LB.png") no-repeat 3px -6px;
	vertical-align: middle;
}

.leftBumperImage_lb.stroke {
	background: url("images/controll-stroke/x360_LB-stroke.png") no-repeat 3px -2px;
	}

.leftBumperImage_rb {
	display: inline-block;
	width: 45px;
	height: 34px;
	background-size: 85% !important;
	background: url("images/white/x360_RB.png") no-repeat 3px -6px;
	vertical-align: middle;
}

.leftBumperImage_rb.stroke {
	background: url("images/controll-stroke/x360_RB-stroke.png") no-repeat 3px -4px;
	}

.leftBumperImage_lt {
	display: inline-block;
	width: 35px;
	height: 38px;
	background-size: 100% !important;
	background: url("images/white/x360_LT.png") no-repeat 0px 1px;
	vertical-align: middle;
}

.leftBumperImage_lt.stroke {
	background: url("images/controll-stroke/x360_LT-stroke.png") no-repeat 0px 1px;
	}

.leftBumperImage_rt {
	display: inline-block;
	width: 35px;
	height: 38px;
	background-size: 100% !important;
	background: url("images/white/x360_RT.png") no-repeat 0px 1px;
	vertical-align: middle;
}

.leftBumperImage_rt.stroke {
	background: url("images/controll-stroke/x360_RT-stroke.png") no-repeat 0px 1px;
	}

.xb_buttonImage_a {
	display: inline-block;
	width: 40px;
	height: 37px;
	background-size: 100% !important;
	background: url("images/white/x360_A.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.xb_buttonImage_a.stroke {
	background: url("images/controll-stroke/x360_A-stroke.png") no-repeat 0px -5px;
	}

.xb_buttonImage_b {
	display: inline-block;
	width: 40px;
	height: 37px;
	background-size: 100% !important;
	background: url("images/white/x360_B.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.xb_buttonImage_b.stroke {
	background: url("images/controll-stroke/x360_B-stroke.png") no-repeat 0px -5px;
	}

.xb_buttonImage_x {
	display: inline-block;
	width: 40px;
	height: 37px;
	background-size: 100% !important;
	background: url("images/white/x360_X.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.xb_buttonImage_x.stroke {
	background: url("images/controll-stroke/x360_X-stroke.png") no-repeat 0px -5px;
	}

.xb_buttonImage_y {
	display: inline-block;
	width: 40px;
	height: 37px;
	background-size: 100% !important;
	background: url("images/white/x360_Y.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.xb_buttonImage_y.stroke {
	background: url("images/controll-stroke/x360_Y-stroke.png") no-repeat 0px -5px;
	}

.xb_buttonImage_start {
	display: inline-block;
	width: 43px;
	height: 30px;
	background-size: 85% !important;
	background: url("images/white/x360_start.png") no-repeat 2px -5px;
	vertical-align: middle;
}

.xb_buttonImage_start.stroke {
	background: url("images/controll-stroke/x360_start-stroke.png") no-repeat 2px -3px;
	}

.xb_buttonImage_back {
	display: inline-block;
	width: 43px;
	height: 30px;
	background-size: 85% !important;
	background: url("images/white/x360_back.png") no-repeat 2px -5px;
	vertical-align: middle;
}

.xb_buttonImage_back.stroke {
	background: url("images/controll-stroke/x360_back-stroke.png") no-repeat 2px -4px;
	}

.right-stick-pressed {
	display: inline-block;
	width: 40px;
	height: 34px;
	background-size: 100% !important;
	background: url("images/white/x360_RS_Click.png") no-repeat 0px -5px;
	vertical-align: middle;
}

.right-stick-pressed.stroke {
	background: url("images/controll-stroke/x360_RS_Click-stroke.png") no-repeat 0px -5px;
	}

.navLinks li a.active {
	background: #000 !important;
	color: #fff;
}
.navigoning-rb {
	float: right;
	width: 35px;
	height: 25px;
	background: url("images/xbox/controls-btns.png") no-repeat -36px 0px;
	vertical-align: middle;
	opacity: 0.5;
	margin: 30px -90px 0 0;
}
.navigoning-lb {
	float: right;
	width: 35px;
	height: 25px;
	background: url("images/xbox/controls-btns.png") no-repeat 0px 0px;
	vertical-align: middle;
	opacity: 0.5;
	margin: 23px 0px 0 0;
}
.small-navigonian-hints {
	Display: none;
	position: absolute;
	bottom: 17px;
	left: 140px;
	opacity: 0.5;
}
.xb-xtrl-small {
	display: none;
	background: url("images/xbox/ctrls-big.png") no-repeat;
	/* background-size: 80%;*/
	opacity: 0.5;
	width: 240px;
	height: 40px;
	position: absolute;
	bottom: 15px;
	left: 120px;
}
.helpContent p {
	margin-bottom: 5px;
	line-height: 31px;
}
.holder-supp img {
	margin: 0 auto;
	/*max-width: 619px;*/
	padding: 20px 0;
}
.helpContent.full.hiddening {
	overflow: hidden;
}
@media (max-width:380px) and (orientation:portrait) {
.navLinks li a {
	font-size: 18px !important;
}
.navLinks li a i {
	display: none;
}
}
@media (orientation:portrait) and (min-height:660px) {
.scroll-btn {
	display: none;
}
}
 @media (min-width: 1600px) and (min-height:950px) {
.xb-controller {
	max-width: 77% !important;
}
}
.controls-xb-1 {
	list-style: none;
	font-size: 14px;
	text-transform: uppercase;
	line-height: 38px;
	vertical-align: middle;
}
.controls-xb-1 i {
	margin: 0 10px 0 0;
	width: 40px;
}
i.rightStickImage_up, i.dPadImage_up {
	background-position: 0 0;
	height: 40px;
}
i.rightStickImage_down {
}


.helpMenu li a {
	padding: 0 31px 0 56px;
}
.contentPanel {
	overflow: auto;
	background: #000 url(images/Collection_board_Full.jpg) repeat-y;
}
.contentPanel .articleTopic {
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 26px;
	text-transform: uppercase;
	font-weight: 500;
	margin-top: 9px;
	line-height: 46px;
}
.navLinks {
	padding: 60px 0 80px 40px;
}
.navLinks ul li {
}
.navLinks li:nth-child(odd) a {
	background-color: rgba(202, 202, 202, 0.1);
}
/* .navLinks li a:hover {
    background: #02b1f4 url(images/trial-arrow-please-32.png) no-repeat 370px 20px;
    outline: none;} */
.contentPanel .articleTitle {
	font-family: 'thecrew_sans_regularregular', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	margin-top: -8px;
}
.navLinks li a {
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 300;
}
.navLinks a {
	border: 4px solid transparent;
	outline: none;
}
.helpContent {
/*background:#1d1e1e;*/}
.helpContent.full {
/*-moz-column-count: auto;
    -webkit-column-count: auto;
    column-count: auto;
    -moz-column-width: 450px;
    -webkit-column-width: 450px;
    column-width: 450px;
    -moz-column-gap: 80px;
    -webkit-column-gap: 80px;
    column-gap: 80px;
    -webkit-column-fill: auto;
    -moz-column-fill: auto;
    column-fill: auto;
    */}
.helpContent img {
    /*max-width: 92%;
    height: auto;
     display: block;
	margin: 0 auto;
	margin-bottom: 15px;*/
}
.blueish {
	color: #02b1f4;
}
.logo-the-crew {
	width: 90%;
	margin-bottom: 0px !important;
}

/*.logo-t {
    display:block;
    height:auto;
    width: auto;
    overflow:hidden;
}*/

@media (max-height:800px) {
.logo-the-crew {
	width: 70%;
	margin-bottom: 0px !important;
}
}
.pageCounter {
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
	display: none;
}
.panelButtons .pageCounter {
	display: block;
	margin: 20px 0px -13px 0px;
	height: 48px;
}
.pageButton:hover:not(:focus) {
	color: #02b1f4;
	outline: none;
	border: none;
}
.pageButton {
	outline: none;
	border: none;
}
.pageButton.previous {
	position: absolute;
	bottom: -7px;
}
.nextButtonText, .pageButton.previous {
	font-family: 'thecrew_sans_regularregular', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 20px;
	margin: 0px;
}
.helpContent h2 {
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 42px;
	text-transform: uppercase;
	font-weight: 300;
	margin: 0 0 0 0;
}
.title-skill {
	font-family: 'thecrew_sans_boldbold', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 26px;
	text-transform: uppercase;
	font-weight: 300;
	margin: 25px 0 15px 0;
}
.helpContent h2:after {
	padding-bottom: 20px;
}
.container-h2-bg {
	display: block;
	height: 63px;
	width: 100%;
	position: relative;
	margin-bottom: 18px;
}
.back-to {
	font-family: 'thecrew_sans_regularregular', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 24px;
	position: relative;
	top: 2.8em; /*1.7*/
	left: 2em; /* 2 */
	width: 170px;
	display:block;
}
/*Here's an example of using this file to skin based upon a media query, in this case it will work on smartglass tablet devices
 Note: this is a duplicate of the media query used inline in the html to load tablet.css for the index page*/
@media (orientation:landscape) and (max-height: 900px), (orientation:landscape) and (min-height: 1081px), (orientation:landscape) and (max-width: 1430px) and (min-height: 901px) and (max-height: 1080px), (orientation:landscape) and (min-width: 1930px) and (min-height: 901px) and (max-height: 1080px) {
.small-navigonian-hints {
	display: block;
	left: 60px;
}
/*This would add a background image to the content panel in tablets only. Note: you need an additional selector to give this rule
    enough weight to override the existing in tablet.css*/
.articles article:not(.helpMenu) .contentPanel {
/*  background: url("Forza_Left.png") no-repeat transparent 24px 60px;*/
}
.text-logo-xb-skin {
	font-size: 62px;
}
.navLinks li a {
	font-size: 20px;
}
.back-to {
	font-family: 'thecrew_sans_regularregular', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 22px;
	position: relative;
	top: 2.3em;
	left: 3.2em;
	width: 170px;
	display:block;
}
.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;
}
.articles article:not(.helpMenu) .articleTitle {
	top: 0.9em;
	left: 3.2em;
	height: 2.3em;
}
.contentPanel .backLink {
	margin: -23px 0 0 -20px !important;
}
.contentPanel .articleTitle {
	top: 2.7em !important;
	left: 1.7em !important;
}
.contentPanel {
}
.helpMenu li a {
	padding: 0px 19px 0px 71px!important;
	width: 100% !important;
}
.contentPanel .backLink {
	margin: -53px 0 0 -50px;
}
.contentPanel {
	height: 100% !important;
	width: 357px !important;
}
.helpMenu li a {
	margin: 0 0 0 -90px;
}
.navLinks li a:hover {
	background: #02b1f4 url(images/trial-arrow-please-32.png) no-repeat 360px 23px !important;
}
.logo-tdt {
	display: none !important;
}
}
 @media (orientation:portrait) and (max-height: 900px), (orientation:portrait) and (min-height: 1081px), (orientation:portrait) and (max-width: 335px) and (min-height: 901px) and (max-height: 1080px), (orientation:portrait) and (min-width: 481px) and (min-height: 901px) and (max-height: 1080px) {
.panelButtons {
	left: 23px !important;
}
.panelButtons.pageCounter {
	line-height: 31px;
	height: 34px;
}
.previous.pageButton {
	width: 83px;
}

.text-logo-xb-skin {
	font-size: 62px;
	margin: 25px 0px 0px 0px;
	display: block;
}
.back-to {
	font-family: 'thecrew_sans_regularregular', Segoe UI Regular, HelveticaNeue, Droid Sans, Arial, Sans-Serif;
	font-size: 22px;
	position: relative;
	top: 0.8em;
	left: 3em;
	width: 170px;
	display:block;
}
.contentPanel .backLink:focus {
	background: transparent url(left_arrow_hoverFocus.png) no-repeat 25px 73px;
	background-size: 25%;
	outline: 0;
}
.pageCounter {
	height: 1.5em !important;
	width: 100% !important;
	visibility: visible;
	bottom: 0.5em !important;
	left: 1em !important;
	right: .5em !important;
}
.contentPanel .backLink {
	margin: -53px 0 0 -50px;
}
.contentPanel {
	height: 92% !important;
	width: 100% !important;
}
.navLinks li a i {/*display:none;*/
}
.helpMenu li a {
	padding: 0px 0px 0px 59px!important;
	font-size: 22px;
}
.navLinks li a:hover {
	background: #02b1f4 /*url(images/trial-arrow-please-32.png) no-repeat 17em 13px !important*/;
}
.contentPanel .articleTopic {
	margin: 5px 0px 0px 0px;
	font-size: 28px;
}
/*.helpContent {
    height: 70% !important;
    top: 20% !important;
    width: 80%;
    left: 8%;
    -moz-column-count: auto!important;
    -webkit-column-count: auto!important;
    column-count: auto!important;
    -moz-column-width: 300px !important;
    -webkit-column-width: 300px !important;
    column-width: 300px !important;
    -moz-column-gap: 80px!important;
    -webkit-column-gap: 80px!important;
    column-gap: 80px!important;
    -webkit-column-fill: auto!important;
    -moz-column-fill: auto!important;
    column-fill: auto!important;
    background-color: transparent;
    -webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
    margin-right:100px;}
*/
.helpContent.full {
	height: 76%;
	top: 15% !important;
	width: 80%;
	left: 8%;
}
.helpContent.fs-400 {
	height: 70% !important;
	top: 20% !important;
	width: 80%;
	left: 8%;
	/*overflow: auto;
	-moz-column-count: auto!important;
	-webkit-column-count: auto!important;
	column-count: auto!important;
	-moz-column-width: 300px !important;
	-webkit-column-width: 300px !important;
	column-width: 300px !important;
	-moz-column-gap: 80px!important;
	-webkit-column-gap: 80px!important;
	column-gap: 80px!important;
	-webkit-column-fill: auto!important;
	-moz-column-fill: auto!important;
	column-fill: auto!important;
	background-color: transparent;
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	-o-column-break-inside: avoid;
	-ms-column-break-inside: avoid;
	column-break-inside: avoid;*//*margin-right:100px;*/
}
/*.back-to {
    top: 90px;
    left: 3.5em;
    margin: -36px 0 0 -5px;
}*/

.helpContent h2 {
	margin: 0px !important;
}
.add-space {
	height: 40px;
    display:block;
}

.add-space.smi {
    height: 20px;
    display:block;
}

.articles article:not(.helpMenu) .articleTitle {
	position: absolute;
	top: 47px;
	left: 28px;
}
.contentPanel.articleTopic {
	font-size: 32px !important;
}
.contentPanel {
	background-repeat: repeat !important;
	padding: 15px 0px 57px 0px !important;
}
/*.helpContent.fs-400 {
    width: 80% !important;
    overflow-x:auto;
    padding-bottom:10px;
}*/


.logo-tdt {
/*   background: url(images/tc-logo-mobile.png) no-repeat top center;
    display:block;
    height:53px;
    width:auto;*/}
.logo-tdt img {
	width: auto;
	height: auto;
	margin: 10px auto;
	display: block;
}
}
 @media (min-height:250px) and (max-height:650px) {
.helpContent.fs-400 {
	height: 65% !important;
	width: 80% !important;
	top: 17% !important;
	overflow-x: auto;
	padding-bottom: 10px;
}
.extra-content-container {
	line-height: 37px;
	font-size: 16px;
}
}
 @media (orientation:portrait) and (max-height:600px), (orientation:portrait) and (max-width:370px) {
.back-to {
	top: 13px; /*16 / 3.3*/
	left: 2.2em;
	margin: 0;
	font-size: 15px;
	display:block;
}
.hiddening.full.helpContent {
	overflow: auto;
}
.contentPanel .backLink {
	margin: -12px 0 0 27px !important;
	width: 1.9em !important;
}
.articles article:not(.helpMenu) .articleTitle {
	top: 22px;
	left: 28px;
}
.contentPanel .articleTopic {
	margin: 0px 0 0 0;
	font-size: 22px;
}
.articles article:not(.helpMenu) .articleTitle {
/* margin-top: 0.6em !important;*/ /*1.9*/
}
.xb-xtrl-small {
	background-size: 50%;
	bottom: 15px;
}
}

.col-gp {/*
     -webkit-column-break-inside:avoid;
     -moz-column-break-inside:avoid;
     -o-column-break-inside:avoid;
     -ms-column-break-inside:avoid;
     column-break-inside:avoid;
    display:inline-block;
       -webkit-column-fill: auto;
      -moz-column-fill: auto;
      column-fill: auto;
     margin-bottom: 70px;*/
}

.col-gp.dow {
    webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
    display: inline-block;
}

.col-br {
   /* -webkit-break-after: always;
    -moz-break-after: always;
    break-after: always;*/
}


.helpContent .contact-size {
    font-size:18px;
}

.helpContent.title-skill {
  /*  webkit-column-break-before:always;
    -moz-column-break-before:always;
    -o-column-break-before:always;
    -ms-column-break-before:always;
    column-break-before:always;*/
}

.Kontrolxb {
    display:block;
}

.Kontrolxb span {
display:block;
font-size:15px;
}

.Kontrolxb span i{
    margin-right:15px;
    width: 40px;

}

@media all and (orientation:landscape) and (max-height:900px), all and (orientation:landscape) and (min-height:1081px), all and (orientation:landscape) and (max-width:1430px) and (max-height:1080px) and (min-height:901px), all and (orientation:landscape) and (min-width:1930px) and (max-height:1080px) and (min-height:901px){
    body.xbone .small-navigonian-hints {
        display:block;
    }
    body.non-xbone .small-navigonian-hints {
        display:none;
    }
}

@media screen and (orientation:portrait) and (min-width: 481px) and (min-height: 901px) and (max-height: 1080px){
    body.xbone .xb-xtrl-small {
        display: none;
    }
    body.non-xbone .xb-xtrl-small {
        display: none;
    }
}

body.xbone .navigoning-lb,
body.xbone .navigoning-rb {
    display:block;
}
body.non-xbone .navigoning-lb,
body.non-xbone .navigoning-rb {
    display:none;
}

.add-space {
    height: 10px;
    display:block;
}
.add-space.smi {
    height: 50px;
    display:block;
}
.add-space.smi.o {
    height: 100px;
    display:block;
}