html
{
	overflow: auto;
}

body
{
	background-repeat: no-repeat;
	color: Black;
	font-family: arial, sans-serif;
	font-size: 12px;
	margin: 0px;
	position: relative;
	min-height: 600px;
	min-width: 700px;
}

.BackgroundGreen
{
	background-image: url(../images/green.jpg);
}

.BackgroundBlue
{
	background-image: url(../images/blue.jpg);
}

.BackgroundGrey
{
	background-image: url(../images/grey.jpg);
}

.BackgroundGrey
{
	background-image: url(../images/grey.jpg);
}

.BackgroundPurple
{
	background-image: url(../images/purple.jpg);
	background-repeat: repeat-y;
}

.BackgroundMagenta
{
	background-image: url(../images/magenta.jpg);
}

.BackgroundYellow
{
	background-image: url(../images/yellow.jpg);
}

img
{
	border: 0px;
}

.TROLogoBlack
{
	background: url(../images/tro_black.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

.TROLogoBlue
{
	background: url(../images/tro_blue.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

.TROLogoGreen
{
	background: url(../images/tro_green.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

.TROLogoMagenta
{
	background: url(../images/tro_magenta.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

.TROLogoPurple
{
	background: url(../images/purple_print.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

.TROLogoYellow
{
	background: url(../images/tro_yellow.jpg) no-repeat left top;
	position: absolute;
	display: block;
	width: 130px;
	height: 61px;
	left: 50px;
	top: 50px;
}

/* links at top of each page e.g. Home, What We Do, Engagement, etc */
.genericLinks
{
	position: absolute;
	top: 10px;
	right: 30px;
	text-align: right;
	width: 800px;
	z-index:99;
}

.genericLinks a
{
	font-size: 11px;
	color: Black;
	text-decoration: none; /* 	display: block; 	float: right; 	width: 70px; */
}

/* span container so links can be displayed as block and have a set width applied
/* so that when hover over links turn bold without pushing other links outwards
/* This wrapper is for the longer worded links e.g. Engagement, Showcase */
.genericLinkWrap
{
	display: block;
	float: right;
	width: 80px;
	text-align: center;
}

/* This wrapper is for the shorter worded links e.g. Home, Clients, News, etc */
.genericLinkWrap2
{
	display: block;
	float: right;
	width: 50px;
	text-align: center;
}

.genericLinkWrap3
{
	display: block;
	float: right;
	width: 110px;
	text-align: center;
}

.genericLinkWrap4
{
	display: block;
	float: right;
	width: 120px;
	text-align: center;
}


.genericLinks a:hover
{
	font-weight: bold;
}

.genericLinksBold
{
	font-weight: bold;
}

/* This class allows for there to be 50px of space to the left of the letterbox so regardless of how small
/* the screen is resized to, the home, print and back buttons are always visible.
/* viewSplit, viewFull and viewNews are positioned against this */
.outerViewNews
{
	position: relative;
	width: 840px;
	height: 440px;
	margin: 0px auto;
	padding-left: 50px;
	text-align: left;
}

.outerView
{
	position: relative;
	width: 840px;
	height: 440px;
	margin: 0px auto;
	padding-left: 50px;
	text-align: left;
}

.outerViewNewsBlock
{
	display: block;
	position: relative;
	width: 840px;
	height: 440px;
	margin: 0px auto;
	padding-left: 50px;
	text-align: left;
}

.outerViewBlock
{
	display: block;
	position: relative;
	width: 840px;
	height: 440px;
	margin: 0px auto;
	padding-left: 50px;
	text-align: left;

}

/* Invisible element spanning the width of the window
/* outerView is positioned against this */
.viewParent
{
	position: absolute;
	top: 130px;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
	visibility: visible;
	display: block;
	text-align: center;
}

.viewParentBlock
{
	position: absolute;
	top: 130px;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
	visibility: visible;
	display: block;
	text-align: center;
}

/* The letterbox layout class used for pages such as WhatWeDo.aspx, Engagement.aspx, etc */
.viewSplit
{
	position: relative;
	width: 840px;
	height: 420px;
	border: solid 1px #D1D3D4;
	background-color: White;
	margin: 0px;
	display: none;
	top: 0px; /* top: 40% (without outerView Implemented) */
}

.viewSplitBlock
{
	position: relative;
	width: 840px;
	height: 420px;
	border: solid 1px #D1D3D4;
	background-color: White;
	margin: 0px;
	top: 0px; /* top: 40% (without outerView Implemented) */
	display: block;
}

/* The left area of the div with viewSplit set as its class for the display of text */
.viewSplitLeft
{
	padding-top: 30px;
	padding-left: 30px;
	padding-right: 30px;
	min-width: 310px;
	max-width: 310px;
	width: 370px;
	height: 390px;	
	background-color: White;
}

.viewSplitLeftShowcase
{
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 20px;
	min-width: 260px;
	max-width: 280px;
	width: 300px;
	height: 390px;	
	background-color: White;
}

.viewSplitLeftBlock
{
	display: block;
	width: 280px;
	height: 390px;
	padding-top: 30px;
	padding-left: 30px;
	padding-right: 60px;
	background-color: White;
}

.viewNoFlash
{
	width: 750px;
	height: 390px;
	padding-top: 30px;
	padding-left: 30px;
	padding-right: 60px;
	background-color: White;
}

.viewNoFlashRightBlock
{
	display: block;
	width: 470px;
	height: 420px;
	padding-top: 30px;
	background-color: White;
}

/* The right area of the div with viewSplit set as its class for the display of images/flash content */
.viewSplitRight
{
	position: absolute;
	width: 470px;
	height: 420px;
	background-color: White;
	right: 0px;
	top: 0px; /*overflow-x:scroll; 	overflow-y:hidden;*/
	overflow: hidden;
}

.viewSplitRightBlock
{
	display: block;
	position: absolute;
	width: 470px;
	height: 420px;
	background-color: White;
	right: 0px;
	top: 0px; /*overflow-x:scroll; 	overflow-y:hidden;*/
	overflow: hidden;
}

/* The right area of the div with viewSplit set as its class for the display of a table of images with 
horizontal scrolling */
.viewSplitRightShowcase
{
	position: absolute;
	width: 520px;
	height: 420px;
	background-color: transparent;
	right: 0px;
	top: 0px;
	overflow-x: scroll;
	overflow-y: hidden;
	display: none;
}

.viewSplitRightShowcaseBlock
{
	position: absolute;
	width: 520px;
	height: 420px;
	background-color: transparent;
	right: 0px;
	top: 0px;
	overflow-x: scroll;
	overflow-y: hidden;
	display: block;
}

/* For home button - used for standard viewSplit pages e.g. WhatWeDo.aspx, Engagement.aspx, etc */
.viewSplitHome
{
	position: absolute;
	left: -50px;
	top: 38px;
	margin-left: 0px;
}

/* For home button - used for viewFull pages e.g. Clients.aspx, Showcase.aspx, etc */
.viewFullHome
{
	position: absolute;
	left: -50px;
	top: 38px;
	margin-left: 0px;
	display: none;
}

.viewFullHomeBlock
{
	position: absolute;
	left: -50px;
	top: 38px;
	margin-left: 0px;
	display: block;
}

/* For print button - used for standard viewSplit pages */
.viewSplitPrint
{
	position: absolute;
	left: -47px;
	top: 72px;
	margin-left: 0px;
	display: none;
}

.viewSplitPrintBlock
{
	position: absolute;
	left: -47px;
	top: 72px;
	margin-left: 0px;
	display: block;
}

/* For print button - used for viewFull pages */
.viewFullPrint
{
	position: absolute;
	left: -47px;
	top: 72px;
	margin-left: 0px;
	display: none;
}

.viewFullPrintBlock
{
	position: absolute;
	left: -47px;
	top: 72px;
	margin-left: 0px;
	display: block;
}

/* For back button - used in ShowcaseDetail.aspx */
.viewSplitBack
{
	position: absolute;
	left: -50px;
	top: 72px;
	margin-left: 0px;
	display: none;
}

.viewSplitBackBlock
{
	position: absolute;
	left: -50px;
	top: 72px;
	margin-left: 0px;
	display: block;
}

/* For back button - used in Join.aspx page */
.viewSplitBackCU
{
	position: absolute;
	left: -50px;
	top: 72px;
	margin-left: 0px;
	display: none;
}

.viewSplitBackCUBlock
{
	position: absolute;
	left: -50px;
	top: 72px;
	margin-left: 0px;
	display: block;
}

/* To display image / flash content for the whole letterbox area */
.viewFull
{
	position: relative;
	width: 840px;
	height: 420px;
	border: solid 1px #D1D3D4;
	background-color: White;
	margin: 0px;
	top: 0px;
	display: none; /* top: 40% (without outerView Implemented) */
}

.viewFullBlock
{
	position: relative;
	width: 840px;
	height: 420px;
	border: solid 1px #D1D3D4;
	background-color: White;
	margin: 0px;
	top: 0px;
	display: block; /* top: 40% (without outerView Implemented) */
}

/* Text area Header e.g. 'Join Our Team' (Join.aspx) */
.detHeader
{
	font-size: 26px;
	font-weight: bolder;
	margin: 0px 0px 11px 0px;
}

/* Standard text within letterbox area */
p
{
	font-size: 11px;
	margin: 8px 0px 8px 0px;
}

.pBold
{
	font-weight: bold;
}

.SubH2
{
	font-size: 11px;
	font-weight: bold;
	white-space: nowrap;
	margin: 0px 0px 0px 0px;
	display: inline;
}

.InlineP
{
	display: inline;
	margin: 0px 0px 0px 0px;
}

.SpacedInline
{
	margin-bottom: 11px;
}

/* 'Download Map' links on ContactUs.aspx */
.mapLinks a
{
	text-decoration: none;
	color: Black;
	font-style: italic;
}

.mapLinks a:hover
{
	font-weight: bolder;
}

/* showcase detail images */
.initScImg
{
	display: none;
}

.dispScImg
{
	/*display: inline;*/
	float: right;
	clear: none;
}

/* The showcase links sub-menu links */
.showcaseLinks
{
	position: absolute;
	float: right;
	top: 17px;
	width: 260px;
	height: 120px;
	left: 442px;
	text-align: left;
	padding: 0px;
	margin: 0px;

}

.showcaseLinksBlock
{
	position: absolute;
	float: right;
	top: 17px;
	width: 260px;
	height: 120px;
	left: 442px;
	text-align: left;
	padding: 0px;
	margin: 0px;
	display: block;

}

/* The join us links sub-menu links */
.joinOurTeamLinks
{
	position: absolute;
	float: right;
	top: 14px;
	width: 180px;
	height: 60px;
	left: 640px;
	text-align: left;
	padding: 0px;
	margin: 0px;
}

.joinOurTeamLinksBlock
{
	position: absolute;
	float: right;
	top: 14px;
	width: 180px;
	height: 120px;
	left: 642px;
	text-align: left;
	padding: 0px;
	margin: 0px;
	display: block;
}


/* For styling of the bullet list on WhatWeDo.aspx */
.bulletList
{
	margin-top: 0px;
	padding-top: 0px;
	margin-left: 0px;
	list-style-position: inside;
	padding-left: 0px;
	font-size: 11px;
}

.bulletListNews
{
	font-size: 12px;
}

.bulletList a
{
	padding: 0px;
}

.bulletList li
{
	line-height: 12px;
}

/* For the <UL> element within the showcase sub menu when hidden */
.showcaseList
{
	display: none;
	background-color:White;	

}

/* For the <UL> element within the showcase sub menu when shown */
.showcaseListDisp
{
	margin-top: 0px;
	padding-top: 0px;
	margin-left: 0px;
	white-space:nowrap;
	width:180px;
	list-style-position: inside;
	background-color:White;
	padding-left: 3px;
	padding-top: 2px;
	display: block;
}

.showcaseListDisp a
{
	padding: 0px;
	font-size: 11px;
	text-align: left;

	margin: 0px;
}

.showcaseListDisp li
{
	line-height: 11px;
	background-color:White;
}

.showcaseListDisp a:hover
{
	font-weight: bold;
}


/* Showcase sub menu links boundary box */
.outerSCLinksLeft
{
	position: absolute;
	float: right;
	top: -14px;
	width: 11px;
	height: 203px;
	left: 442px;
	padding: 0px;
}
.outerSCLinksRight
{
	position: absolute;
	float: right;
	top: 14px;
	width: 10px;
	height: 175px;
	right: 171px;
	padding: 0px;
}

.outerSCLinksTop
{
	position: absolute;
	float: right;
	top: -14px;
	width: 200px;
	height: 10px;
	left: 442px;
	padding: 0px;
}
.outerSCLinksBottom
{
	position: absolute;
	float: right;
	top: 179px;
	width: 210px;
	height: 10px;
	left: 442px;
	padding: 0px;
}



/* Joinus sub menu links boundary box */
.outerJULinksLeft
{
	position: absolute;
	float: right;
	top: -14px;
	width: 10px;
	height: 60px;
	left: 610px;
	padding: 0px;
}
.outerJULinksRight
{
	position: absolute;
	float: right;
	top: -14px;
	width: 10px;
	height: 60px;
	right: 80px;
	padding: 0px;
}

.outerJULinksTop
{
	position: absolute;
	float: right;
	top: -14px;
	width: 70px;
	height: 10px;
	left: 610px;
	padding: 0px;
}
.outerJULinksBottom
{
	position: absolute;
	float: right;
	top: 56px;
	width: 70px;
	height: 10px;
	left: 610px;
	padding: 0px;

}


.floatRight
{
	float: right;
	width: 470px;
}

/* For plain link style */
.plainLinks
{
	text-decoration: none;
	color: Black;
}

.plainBoldLinks
{
	text-decoration: none;
	color: Black;
	font-weight: bold;
}


/* join us */
.triImgRightTop
{
	position: absolute;
	right: 0px;
}

.triImgRightBottom
{
	position: absolute;
	bottom: 0px;
	right: 0px;
}
/* end join us */

/* news */
.viewNewsHome
{
	position: absolute;
	left: -50px;
	top: 38px;
	margin-left: 0px;
	display: none;
}

.viewNews
{
	position: relative;
	width: 840px;
	height: auto;
	margin: 0px auto;
	top: 0px;
	display: none;
	background-color: White; /*overflow-y: scroll; 	overflow-x: hidden;*/ /* top: 3.3% (without outerView Implemented) */
}

.viewNews2
{
	position: relative;
	width: 840px;
	height: auto;
	border: solid 1px #D1D3D4;
	margin: 0px auto;
	top: 0px;
	display: none;
	background-color: White; /*overflow-y: scroll; 	overflow-x: hidden;*/
}

.viewNewsHomeBlock
{
	position: absolute;
	left: -50px;
	top: 38px;
	margin-left: 0px;
	display: block;
}

.viewNewsBlock
{
	position: relative;
	width: 840px;
	height: auto;
	margin: 0px auto;
	top: 0px;
	display: block;
	background-color: White; /*overflow-y: scroll; 	overflow-x: hidden;*/ /* top: 3.3% (without outerView Implemented) */
}

.viewNews2Block
{
	position: relative;
	width: 840px;
	height: auto;
	border: solid 1px #D1D3D4;
	margin: 0px auto;
	top: 0px;
	display: block;
	background-color: White; /*overflow-y: scroll; 	overflow-x: hidden;*/
}

.newsTopic
{
	font-size: 11px;
	width: 760px;
	padding: 20px 10px 0px 20px;
	margin: 0px 0px 0px 0px;
	font-weight: normal;
}

.newsTitle
{
	font-size: 26px;
	font-weight: bolder;
	width: 760px;
	height: auto;
	padding: 10px 10px 0px 20px;
	margin: 0px 0px 0px 0px;
}

.newsImg
{
	width: 800px;
	/*height: 320px;*/
	padding: 20px 10px 0px 20px;
}

.newsImgLarge
{
	width: 800px;
	height: 640px;
	padding: 20px 10px 0px 20px;
}

.newsTxt
{
	width: 790px;
	padding: 12px 10px 5px 20px;
	border-bottom: solid 1px #D1D3D4;	
}

.newsTxt p
{
	font-size: 12px;
	margin-bottom: 15px;
}

.newsLinks
{
	text-decoration: none;
	color: Black;
	font-weight: bold;
}


/* end news */
.validate
{
	position: absolute;
	top: 2px;
	left: 20px;
}

.Showreel
{
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

#Showreel
{
	margin: 0px;
	padding: 0px;
	overflow: hidden;
}

#divJs
{
	display: none;
}


#ie6Spacer
{
	position: absolute;
	bottom: 0px;
	display: block;
}

.BrandAmbassadorVacancies
{
    background-image: url(../images/vacancysBackground.jpg);

    width:840px;
    height:420px;
}

.BrandAmbassadorVacancy1
{
    background-image: url(../images/vacancyBackground1.jpg);

    width:840px;
    height:420px;
}

.BrandAmbassadorVacancy2
{
    background-image: url(../images/vacancyBackground2.jpg);

    width:840px;
    height:420px;
}

.detHeaderAmbassadors
{
    margin:0px;
    padding:0px;
    font-size: 26px;
	font-weight: bolder;
    padding-top:38px;
    padding-left:35px;
}

.VacancyList
{
    padding-top:0px;
    padding-left:35px;
}

.VacancyText1
{
    width:355px;
    padding-top:0px;
    padding-left:20px; 
}

.VacancyText2
{
    width:450px;
    padding-top:0px;
    padding-left:20px; 
}

.VacancyHeader
{
    margin:0px;
    padding:0px;
    font-size: 26px;
	font-weight: bolder;
    padding-top:30px;
    padding-left:20px;
}

.NoBreak
{
    white-space:nowrap;
}