@charset "utf-8";

.clr
{
	clear:both;
    height:1px; line-height:1px; font-size:1px;
	margin:-1px 0 0 0; padding:0;
    border:none; visibility: hidden;
}

body {
	background: #ffffff url('../../images/homeheader_bg.gif') repeat-x top center;
	display:block;
	font-size:0.65em;
	line-height:140%;
	font-family: Arial, Helvetica, sans-serif;
	color: #414852;	
	width: 760px;
	margin: 0 auto;  /* centers content */
}

/* container element for all content */
#content
{
	/*width: 760px;
	margin: 0 auto;   centers content */
}


/*
* Describes the div box that spans the whole width of the page at the top
*/
#menuHolder
{
	width: 760px;
	height:148px;
	margin: 0 auto;  
}

/* positioning fruit image logo */
#headerImage { float:left; text-align:left; height:101px; display:block;}

/* positioning wither farm text logo */
#headerText { text-align:right; height:101px; display:block;}

/* main page vacancies box (holds jobs) */
.jobHolder
{
	width:219px;
	padding-left:3px;
	padding-top:3px;
	padding-right:3px;
	background-color:#c1cfdd;
	padding-bottom:3px;
}

/* main apply for work button at bottom of job listing main page */
#applyForWork
{
	float:left;
	text-align:center;
}

/*
* Grey left menu box
*/
.leftMenuBox
{
	width:219px;
	padding-left:3px;
	padding-bottom:30px;
	padding-right:3px;
	float:left;
	height: inherit;
}

/*
* Flag navigation
*/
#flagMenu 
{
	float:right;
	width: 300px;
}
#flagMenu ul
{
	/*background-color: Aqua;*/
}
#flagMenu ul li
{   
    text-indent: -5000px;
    height: 21px;
	width: 25px;
	margin-bottom: 0px;

}
#flagMenu ul li.applygraphic
{  
    height: 17px;
    width: 124px;
	margin-top: 2px;
    background: url(../../images/flag/apply-graphic-new.gif) no-repeat;
}
#flagMenu ul li a
{
	display:block;
	width: 25px;
	padding-bottom: 0px;
	color:#ffffff;
}
#flagMenu ul li a:hover
{
    background-color: yellow;
}
#flagMenu ul li a.uk
{
    background: url(../../images/flag/flag-uk.gif) no-repeat 0 0px;
}
#flagMenu ul li a:hover.uk, #flagMenu ul li a.uk.active
{
    background: url(../../images/flag/flag-uk.gif) no-repeat 0 -21px;
}
#flagMenu ul li a.latvia
{
    background: url(../../images/flag/flag-latvia.gif) no-repeat 0 0px;
}
#flagMenu ul li a:hover.latvia, #flagMenu ul li a.latvia.active
{
    background: url(../../images/flag/flag-latvia.gif) no-repeat 0 -21px;
}
#flagMenu ul li a.lithuania
{
    background: url(../../images/flag/flag-lithuania.gif) no-repeat 0 0px;
}
#flagMenu ul li a:hover.lithuania, #flagMenu ul li a.lithuania.active
{
    background: url(../../images/flag/flag-lithuania.gif) no-repeat 0 -21px;
}
#flagMenu ul li a.poland
{
    background: url(../../images/flag/flag-poland.gif) no-repeat 0 0px;
}
#flagMenu ul li a:hover.poland, #flagMenu ul li a.poland.active
{
    background: url(../../images/flag/flag-poland.gif) no-repeat 0 -21px;
}
#flagMenu ul li a.slovakia
{
    background: url(../../images/flag/flag-slovakia.gif) no-repeat 0 0px;
}
#flagMenu ul li a:hover.slovakia, #flagMenu ul li a.slovakia.active
{
    background: url(../../images/flag/flag-slovakia.gif) no-repeat 0 -21px;
}




.subContent {
	width: 760px;
	height: auto;
	display: block;
	padding-left: 0px;
	margin: 0 auto;
	float: right;
	background-image: url(../../images/apply/background.gif);
	background-repeat: repeat-y;
	padding-bottom: 20px;
}

#bigbutton {
	width: 760px;
	height: 60px;
	background-color: #bb201f;
}
#bigbutton p {
	margin: 0;
	padding-top: 18px;
}
#bigbutton a {
	padding-right: 21px;
	padding-top: 2px;
	color: #FFFFFF;
	font-size: 1.4em;	
	background: url(../../images/apply/arrow.gif) top right no-repeat;
}

.subContent .imageArea {
	background-color:#4B515B;
	width: 225px;
	color: #FFFFFF;
	float: left;
}
.subContent .textArea {
	/*background-color:#4B515B;*/
	float: right;
	width: 530px;
	color: #FFFFFF;
}
.subContent .textArea p {
	margin-top: 0px;
}
.subContent .textArea ul {
	color: #4B515B;
	font-size: 1.4em;
	padding-left: 50px;
	list-style-image: url(../../images/apply/bulletpoint.gif);
}
.subContent .textArea ul li {
	list-style-image: url(../../images/apply/bulletpoint.gif);
	padding-bottom: 10px;
}
.bumpIn {
	margin-left: 10px;
}



.bottomContent
{
	background: url(../../images/leftMenubg.gif) top left repeat-y;
	height:100%;
}

.leftMenuBox img{
	margin-left: -3px;
}

.leftMenuBox a {
	border:none;
}

.leftMenuBox p
{
	color:#ffffff;
	margin-left:15px;
	line-height: 14pt
}

.leftMenuSpacing
{
	padding-top:3px;
	padding-left: 3px;
}


.standardTopContent
{
	float:left;
	height:179px;
	margin-bottom:16px;
}

.topContent
{
	float:left;
}

.rightContent { float:left; position:relative;	margin-left:16px;}



/*
* Most pages have a 'main content' div. This is where the body of the text goes
*/
.mainContent
{
	margin-left:16px;
	width:519px;
	height:100%;
	float:left;
	padding-bottom: 20px;
	background-color:#f8f9f0;
}



.mainContent p, .subContent p
{
	padding-left:16px;
	padding-right:16px;
}

/*
* Links within main body content (bold dark red - with no rollover states)
*/
.mainContent p a
{
	color:#bb201f;
	font-weight:bold;
	text-decoration: none;
}


.mainContent ul {
	margin-left: 45px;
	margin-right: 45px;
	font-weight: bold;
}

.mainContent ul li {
	list-style-image: url(../../images/bulletpoint.gif);
	margin-bottom: 10px;
}





/*.leftMenuPictureItem#pictureText
{
	width:219px;
	height:22px;
}*/

/* Describes the footbar properties */
#footer
{
	height:37px;
	background-image:url('../../images/footer_bg.gif') ;
	background-repeat: no-repeat;
	background-color: #4b515b;
	margin-top:1px;
	width: 760px;
	margin: 0 auto; 
	
}
#footerLogo { float:left; }
#footerLogo img { margin-left:95px; display:block }

#websiteByFooterHolder 
{ 
	float:right; 
	font-family: Arial, Helvetica, sans-serif; 
	font-size:10px; 
	color:#94a2b1; 
	margin-top:14px;
	margin-right:16px;
}
#websiteByFooterHolder  a
{ 
	color:#ffffff; 
	text-decoration:none;
}

/***************************************************************************
* Titles and Text
*
* Refer to testElements.html for usage etc.
*
****************************************************************************/

/* common navigation font (change here to update all navigation font */
.mainHeaderGreen, .mainHeaderBlue, .vacanciesTitle, p, .imageLabel, .formTitle, .mainHeaderRecycle
{
 	font-family: Arial, Helvetica, sans-serif;
	
}

/* mainHeader1 is used with an image tag inserted between the div tags. That is, the title text is a graphic. */
.mainHeaderGreen, .mainHeaderBlue, .mainHeaderRecycle
{
	width:503px;
	height:23px; 
}

.mainHeaderGreen, .mainHeaderBlue, .mainHeaderRecycle
{
	padding-left:16px;
	padding-top:9px;
	font-size:10px;
}
.mainHeaderApply
{
	background-color:#e3e7c3;
	padding-left:16px;
	padding-top:9px;
	height: 26px;
	font-size:16px;
	font-weight: bold;
	color: #636a73;
}

.largerText {
	font-size: 16px;
}

.mainHeaderGreen { background-color:#e3e7c3; }
.mainHeaderRecycle { background-color:#189112; }
.mainHeaderBlue, .formTitle, .formTitleCentre { background-color:#d5e2ef; }

.formTitle, .formTitleCentre
{
	color:#636a73;
	font-weight:bold;
	font-size:12px;
	padding:11px;
	padding-left: 17px;
	height:auto;
	display: block;
}

.formTitleCentre{
	text-align:center;
}


/* .job class deals with jobs (contained within jobHolder)
*/

.job
{
	font-family: Arial, Helvetica, sans-serif;
	font-size:11px;
	height:42px;
	background-color:#acbccd;
	margin-top:3px;
}

.job #jobDescription
{
	float:left;
	padding-top:6px;
	padding-left:13px;
}

.job #jobTitle
{
	color:#4b515b;
	font-weight:bold;
}

.job #neededBy { color:#ffffff; }

.job #applyButton
{
	text-align:right;
	padding-top:11px;
	padding-right:7px;
}

.jobDescription
{
	float:left;
	padding-top:6px;
	padding-left:13px;
}

.jobTitle
{
	color:#4b515b;
	font-weight:bold;
}

.neededBy { color:#ffffff; }

.applyButton
{
	text-align:right;
	padding-top:11px;
	padding-right:7px;
}

.jobDescription
{
	float:left;
	padding-top:6px;
	padding-left:13px;
}

.jobTitle
{
	color:#4b515b;
	font-weight:bold;
}

.neededBy { color:#ffffff; }

.applyButton
{
	text-align:right;
	padding-top:11px;
	padding-right:7px;
}



/* used to describe/title an image */

.imageHolder {
	margin: 10px;
}

.imageHolder .imageLabel {
	font-weight:bold;
	font-size:10px;
	margin-left: 3px;
	margin-bottom: 20px;
	border: none;
}

.imageHolder img {
	border: 3px solid #8e9aa6;
	height: auto;
  	width: auto; 
  	text-align: center; 
}

.imageHolder .fullWidth {
	margin-left: 7px;
	margin-bottom: 10px;
}		


/*
* Main body text. Must be used in <p> </p>. To provide the spacing (padding) around it and other elements, use within <div class="mainContent"> /<div>
*/
p
{
	font-size:12px;
	line-height: 22px;
	color:#414852;
}

/*
* To make a link in paragraph text. Use normal html linking method (<a href="#"> Link </a>). Must be used within paragraph
*/

p a
{
	color:#bb201f;
	font-weight:bold;
	text-decoration: none;
}
/***************************************************************************
* END OF NAVIGATIONAL ELEMENTS
****************************************************************************/







/***************************************************************************
* NAVIGATIONAL ELEMENTS
*
* Refer to testElements.html for usage etc.
*
****************************************************************************/
ul
{
	margin: 0;
	padding: 0px;
	list-style: none;
}

li
{
	margin: 0;
	padding: 0px;
	list-style: none;
}
/* common navigation font (change here to update all navigation font */
.leftNav1, .leftNav2, .whiteRedleftNav, .greyWhiteleftNav, .lightBlueSubMenuItem, .leftNav4, .mainHeaderSelectable, #menuHolder ul li

{
 		font-family: Arial, Helvetica, sans-serif;
		letter-spacing: 0.6px;
}

.imageArea .applyButton {
	padding-top: 3px;
	background: url(../../images/apply/arrow.gif) top right no-repeat;
	background-color: #bb201f;
	height: 20px;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	padding-right: 20px;
}

.imageArea .applyButton a {
	color: #fff;
	text-decoration: none;
}

/*
* Formatting for menu items in main header navigation
*/
#menuHolder ul
{
	margin: 0;
	position:absolute;
	top:111px;
	padding: 0px;
	list-style: none;
}

#menuHolder ul li a
{
	padding-left:8px;
	padding-right:8px;
	padding-top:4px;
	padding-bottom:4px;
	text-decoration: none;
	display:block;
	color:#ffffff;
}


#menuHolder ul li
{
	float:left;
	/*color:#ffffff;*/
	font-size:11px;
	height:18px;
	margin-right:8px;
}




/* When on the page that menu item refers to use as follows: <li id="selected">  About </li> */
#menuHolder ul li#selected a, #menuHolder ul li a:hover
{
	color:#414852;
	background-color:#c1cfdd;
	padding-bottom:4px;
}

/* 
* Left hand menu box navigation type 1 & 2 & 3. Blue background with bold grey text with padding and white 
* background with red bold text (just link, no arrow) and white background with red text, right justified with arrow.
* Defines diemnsion for each. Euqals to 22px height and 219px wide once you add the passing
*/
.leftNav1, .leftNav2, .whiteRedleftNav, .greyWhiteleftNav, .lightBlueSubMenuItem
{
	height:16px;
	width:205px;
	padding-left:14px;
	padding-top:6px;
	font-weight:bold;
	font-size:11px;
	margin-top:3px;

}

.leftNav1 a, .leftNav2 a, .whiteRedleftNav a, .greyWhiteleftNav a, .lightBlueSubMenuItem a, .leftNav4 a, .leftNav5 a
{
	text-decoration:none;
}

.lightBlueSubMenuItem a:hover{
	text-decoration: underline;
}

.leftNav4, .leftNav5
{
	height:31px;
	width:219px;
}

.leftNav4
{
	text-align:right;
	background-color:#bb201f;
	margin-top: 5px;
}


.leftNav5
{
	text-align:right;
	background-color:#4b515b;	
}

/*
*  Left hand menu box navigation type 1. 
*  Blue background with bold grey text with padding (used for the .mainHeaderSelectable as well (see below))
*/
.leftNav1, .mainHeaderSelectable, .lightBlueSubMenuItem, .leftNav1 a, .lightBlueSubMenuItem a, .mainHeaderSelectable a
{
	background-color:#d5e2ef;
	color:#6b7178;
	font-size:11px;
}


/*
*  Left hand menu box navigation type 2. 
*  White background with red bold text
*/
.leftNav2, .whiteRedleftNav, .whiteRedleftNav a
{
	background-color:#ffffff;
	color:#bb201f;
}

.greyWhiteleftNav
{
	background-color:#4b515b;
	color:#ffffff;
}

.whiteRedleftNav, .greyWhiteleftNav, .lightBlueSubMenuItem
{
	background-position: right;
	background-repeat:no-repeat;
	text-align:right;
	padding-top:4px;
	padding-right:15px;
	padding-left:0px;
	height:18px;
	width:204px;
}
.whiteRedleftNav {
	height:auto;
	padding-bottom: 3px;
}

.whiteRedleftNav  {	background-image:url('../../images/red_left_nav_arrow.gif'); }

.greyWhiteleftNav { background-image:url('../../images/white_left_nav_arrow.gif'); }

.lightBlueSubMenuItem { font-weight:normal; background-image:url('../../images/grey_left_nav_arrow.gif'); }


.whiteRedleftNav a:hover{
	text-decoration: underline;
}

	

/* background colour and font colou set earlier */
.mainHeaderSelectable
{
	width:515px;
	height:22px;
	padding-left:4px;
	padding-top:10px;
}

.mainHeaderSelectable link
{
	text-decoration:none;
}
.mainHeaderSelectable visited
{
	text-decoration:none;
}
.mainHeaderSelectable selected
{
	text-decoration:none;
}
.mainHeaderSelectable active
{
	text-decoration:none;
}

.mainHeaderSelectable#selectable
{
	color:#bb201f;
	font-weight:bold;
	font-size:14px;
}

.mainHeaderSelectable#selected
{
	width:515px;
	height:22px;
	padding-left:2px;
	padding-top:10px;
	
	color:#6b7178;
	font-weight:bold;
	font-size:14px;
}

/***************************************************************************
* END OF NAVIGATIONAL ELEMENTS
****************************************************************************/