@import url(global.css);

#Page
{
	width: 830px;
	padding-bottom: 5em;
}

body.Black { background: #000; }

/*
-------------------------------------------------------------------
Header
*/

#Header { height: 165px; }

#Header .Logo
{
	margin: 0;
	padding: 0;
	width: 139px;
	height: 139px;
	background-image: url(../images/perrett-laver-logo.png);
	background-repeat: no-repeat;
	margin-left: 8px;
	position: relative;
	top: 8px;
}

body.Black #Header .Logo { background-image: url(../images/perrett-laver-logoK.png); }

#Header .Logo a
{
	display: block;
	width: 100%;
	height: 100%;
}

#Header .Logo em { display: none; }

/*
-------------------------------------------------------------------
Navigation
*/

#Navigation
{
	width: 250px;
	float: left;
}

#Navigation .Title
{
	width: 95px;
	border-top: 1px solid #ccc;
	height: 0.7em;
	overflow: hidden;
	margin: 0;
	padding: 0;
	margin-left: 30px;
}

#Navigation .Title span { display: none; }

#Navigation ul
{
	margin: 0;
	padding: 0;
	margin-left: 30px;
	list-style: none;
}

#Navigation li ul
{
	padding-top: 0.4em;
	margin-top: 0;
	margin-left: 10px;
	display: none;
}

#Navigation li li ul
{
	margin-left: 20px;
	display: none;
}

/*#Navigation li.On ul { display: block !important; }*/
#Navigation li
{
	margin: 0;
	padding: 0;
	list-style: none;
	margin-bottom: 0.7em;
	background-image: none;
}

#Navigation li.First { width: 95px; }

/*these auto widths now set manually below*/
#Navigation li.Second { width: auto; }
#Navigation li.Third { width: auto; }
#Navigation ul ul ul { width: 9em; }

#Navigation li a
{
	display: block;
	width: 100%;
	color: #111;
	text-decoration: none;
	font-size: 11px;
}

body.Black #Navigation li a { color: #fff; }
#Navigation li a:hover { text-decoration: none; }
#Navigation li.First a:hover { color: #ee2276; }

#Navigation li.First a.On
{
	background-color: #ee2276 !important;
	color: #fff !important;
}

#Navigation li.Second a:hover { color: #78787b; }

#Navigation li.Second a.On
{
	background-color: #ccc !important;
	color: #111 !important;
}

#Navigation li.Feature-Appt,
#Navigation li.Feature-Appt a,
#Navigation li.Feature-Appt a.Feature-Appt { background: #fff !important; }
#Navigation li.Third a { color: #666; }

#Navigation li.Third a:hover,
#Navigation li.Third a.On
{
	font-weight: bold !important;
	color: #111 !important;
	background: transparent !important;
}

#Navigation li span
{
	padding: 1px 3px 1px 3px;
	display: block;
}

/* Manual widths of naviagtion sub-menus */
/* About us */
.Nav-Main-1 ul { width: 14.8em; }

/* Services */
.Nav-Main-4 ul { width: 8.8em; }

/* Case Studies */
.Nav-Main-4 .Third { width: 13em !important; }

/* Sectors */
.Nav-Main-122 ul { width: 15.8em; }

/* People */
.Nav-Main-120 ul { width: 10em; }

/* Canidates */
.Nav-Main-125 ul { width: 13em; }

/* Careers */
.Nav-Main-134 ul { width: 9em; }

/*
-------------------------------------------------------------------
Content
*/

#Content
{
	float: right;
	width: 406px;
	margin-right: 144px;
	border-top: 1px solid #ccc;
	padding-top: 0.7em;
	padding-bottom: 5em;
}

#Content.Plain
{
	border-top: 0;
	padding-top: 0;
}

#Content.Content-Sidebar
{
	min-height: 500px;
	width: 551px;
	margin: 0;
	border-top: 0;
	padding: 0;
}

/*
-------------------------------------------------------------------
Articles List
*/

.Articles-List h4
{
	text-transform: uppercase;
	margin-bottom: 0.1em;
}

.Articles-List .Date
{
	font-style: italic;
	margin-bottom: 0.1em;
}

.Articles-List .Abstract { margin-bottom: 0.2em; }
.Articles-List .Link { font-weight: bold; }

/*
-------------------------------------------------------------------
Archive List
*/

.Archive-List .Article { margin-bottom: 1em; }

.Archive-List .Date
{
	font-weight: bold;
	margin-bottom: 0;
}

.Archive-List .Link
{
	position: relative;
	top: -0.1em;
}

/*
-------------------------------------------------------------------
.Article
*/

.Article-Detail .Img-Left { margin-bottom: 1.1em; }
.Article-Detail .Date { text-transform: uppercase; }

/*
-------------------------------------------------------------------
Icon Blocks List
*/

.Icon-Blocks-List
{
	list-style: none;
	margin: 0;
	padding: 0;
}

.Icon-Blocks-List li
{
	list-style: none;
	margin: 0;
	padding: 0;
	width: 135px;
	height: 135px;
	float: left;
	position: relative;
	overflow: hidden;
}

.Icon-Blocks-List li img { position: absolute; }

.Icon-Blocks-List li .Link
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-decoration: none !important;
	background: #fff url(../images/circles-squares_bg.png) no-repeat;
}

.Icon-Blocks-List li.First a.Link { background-position: left top; }
.Icon-Blocks-List li.First a.Link:hover { background-position: 0 -200px; }
.Icon-Blocks-List li.First a * { cursor: pointer; }

.Icon-Blocks-List li.First .Mask
{
	background-image: url(../images/circles-squares_bg.png);
	background-repeat: no-repeat;
	background-position: -200px -200px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.Icon-Blocks-List li.Second a.Link { background-position: 0 0; }
.Icon-Blocks-List li.Second a.Link:hover { background-position: 0 -200px; }
.Icon-Blocks-List li.Second a * { cursor: pointer; }

.Icon-Blocks-List li.Second img
{
	top: 20px;
	left: 20px;
	width: 95px;
	height: 95px;
}

.Icon-Blocks-List li.Second .Mask
{
	cursor: pointer;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.Icon-Blocks-List li .Details
{
	display: none;
	padding-left: 22px;
	padding-right: 18px;
	padding-top: 24px;
	position: absolute;
	top: 0;
	left: 0;
}

.Icon-Blocks-List li a.Link:hover .Details { display: block; }
.Icon-Blocks-List li a.Link:hover img { display: none; }

.Icon-Blocks-List li .Name
{
	font-family: georgia,times,serif;
	display: block;
	margin-bottom: 0.6em;
	font-size: 1.3em;
	line-height: 1em;
	font-weight: normal;
	letter-spacing: -0.02em;
	color: #ee2276;
}

.Icon-Blocks-List li .Position { color: #fff; }

/*
-------------------------------------------------------------------
Icon Blocks List Type 2
*/

.Icon-Blocks-List2
{
	list-style: none;
	margin: 0;
	padding: 0;
}

.Icon-Blocks-List2 li
{
	list-style: none;
	margin: 0;
	padding: 0;
	width: 135px;
	height: 135px;
	float: left;
	position: relative;
	overflow: hidden;
}

.Icon-Blocks-List2 li img
{
	position: absolute;
	display: none;
}

.Icon-Blocks-List2 li .Link
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-decoration: none !important;
	background: #fff url(../images/circles-squares_bg.png) no-repeat;
}

.Icon-Blocks-List2 li.First a.Link { background-position: -200px top; }
.Icon-Blocks-List2 li.First a.Link:hover { background-position: -200px -200px; }
.Icon-Blocks-List2 li.First a * { cursor: pointer; }
.Icon-Blocks-List2 li.Plain a * { cursor: default; }

.Icon-Blocks-List2 li.First .Mask
{
	background-image: url(../images/circles-squares_bg.png);
	background-repeat: no-repeat;
	background-position: -200px -200px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.Icon-Blocks-List2 li.Second a.Link { background-position: 0 0; }
.Icon-Blocks-List2 li.Second a * { cursor: pointer; }
.Icon-Blocks-List2 li.Second a.Link:hover { background-position: 0 0; }
.Icon-Blocks-List2 li.NoImg a.Link:hover { background-position: 0 0; }

.Icon-Blocks-List2 li.Second img
{
	top: 20px;
	left: 20px;
	width: 95px;
	height: 95px;
}

.Icon-Blocks-List2 li.Second .Mask
{
	cursor: pointer;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.Icon-Blocks-List2 li .Details
{
	display: block;
	position: absolute;
	top: 20px;
	left: 20px;
	width: 95px;
	height: 95px;
	background: #fff;
}

.Icon-Blocks-List2 li a.Link:hover .Details { display: none; }
.Icon-Blocks-List2 li.Plain a.Link:hover .Details,
.Icon-Blocks-List2 li.NoImg a.Link:hover .Details { display: block !important; }

.Icon-Blocks-List2 li.NoImg a.Link:hover .Details
{
	background: #000;
	cursor: pointer;
}

.Icon-Blocks-List2 li a.Link:hover img { display: block; }
.Icon-Blocks-List2 li.NoImg a:hover * { cursor: pointer; }

.Icon-Blocks-List2 li .Name
{
	font-family: georgia,times,serif;
	display: block;
	margin-bottom: 0.6em;
	font-size: 1.2em;
	line-height: 1em;
	font-weight: normal;
	letter-spacing: -0.02em;
	color: #111;
	padding-left: 8px;
	padding-right: 6px;
	padding-top: 8px;
}

.Icon-Blocks-List2 li.NoImg a.Link:hover .Name { color: #ee2276 !important; }

.Icon-Blocks-List2 li .Position
{
	color: #555;
	display: block;
	padding-left: 8px;
	padding-right: 6px;
	font-size: 0.95em;
}

.Icon-Blocks-List2 li.NoImg a.Link:hover .Position { color: #fff !important; }

/*
-------------------------------------------------------------------
Forms
*/

.Form-Standard { padding-top: 2em; }
.formField { clear: left; }

.formField label
{
	display: block;
	color: #555;
}

.formFieldError label { color: #ee2276; }

.formNote
{
	color: #999;
	font-size: 10px;
}

label.fieldFileRadioLabel
{
	display: inline !important;
	color: #777 !important;
	font-size: 0.9em;
	position: relative;
	top: -0.1em;
}

.formFieldStandard textarea,
.formFieldStandard input
{
	width: 60%;
	border-width: 1px;
	border-style: solid;
	border-color: #888 #ddd #ddd #888;
	margin-right: 0.4em;
}

.formFieldStandard textarea { height: 5em; }

.formFieldStandard input.Radio
{
	width: auto;
	border: 0;
	position: relative;
	top: 2px;
}

.fieldFileRadioLabel
{
	display: inline !important;
	padding-left: 0.2em;
}

.formButtons
{
	clear: left;
	padding-top: 0.8em;
}

.formFieldErrorNote { display: -moz-inline-box; }

.formFieldErrorNote
{
	display: inline-block;
	color: #555;
}

.formError { display: -moz-inline-box; }

.formError
{
	/*for inline-block effect*/
	float: left;
	border: 1px solid #ee2276;
	padding: 0.4em 0.5em 0 0.5em;
	margin-bottom: 1em;
}

.formError h2,
.formError h3,
.formError h4
{
	margin-top: 0;
	color: #ee2276;
	font-family: arial,sans-serif;
	font-weight: bold;
}

.formBtnSubmit
{
	width: 61px;
	height: 18px;
	position: relative;
	/*top: 100px;*/
}

/*  Special styled file input  */
.SI-FILES-STYLIZED label.formFileInputStyled
{
	width: 61px;
	height: 18px;
	margin-top: 3px;
	background: url(../images/btn-choose-file.png) 0 0 no-repeat;
	display: block;
	overflow: hidden;
	cursor: pointer;
	float: left;
	position: relative;
}

.SI-FILES-STYLIZED label.formFileInputStyled input.formFileInput
{
	position: relative;
	height: 100%;
	width: auto;
	opacity: 0;
	-moz-opacity: 0;
	cursor: pointer;
}

.formFileInputStyled-filename
{
	color: #888;
	float: left;
	font-size: 10px;
	position: relative;
	top: 6px;
	line-height: 12px;
	padding-left: 1em;
}

/*
Custom form styles
*/

/*
-------------------------------------------------------------------
Messages
*/

.msgSuccess h1,
.msgSuccess h2,
.msgSuccess h3,
.msgSuccess h4
{
	margin-top: 0;
	color: #000;
}

/*
-------------------------------------------------------------------
Accordion "drawers" effect
*/

.Drawers { }

.Drawer-Control
{
	cursor: pointer;
	color: #111;
	background-image: url(../images/drawers-arrows.png);
	background-position: right 0;
	background-repeat: no-repeat;
	clear: both;
}

.Drawer-Control * { color: #111; }
.Drawer-Control-Active { background-position: right -500px; }
.Drawer-Control-Active * { color: #ee2276; }
.Drawer-Control-Open { background-position: right -1000px; }
.Drawer-Control-Open * { color: #ee2276; }

/*
-------------------------------------------------------------------
Text Drawers
*/

.Text-Drawers { }

.Text-Drawer-Control
{
	border-top: 1px solid #ccc;
	padding-top: 0.4em;
	min-height: 43px;
}

.Text-Drawer-Control h2 { margin-top: 0; }

.Text-Drawer-Control .Number
{
	display: block;
	float: left;
	width: 50px;
	height: 43px;
	background-repeat: no-repeat;
	background-position: left top;
	margin: 0;
	margin-top: 2px;
	padding: 0;
}

.Drawer-Control-Active .Number,
.Drawer-Control-Open .Number { background-position: left -100px; }
.Text-Drawer-Control .Number strong { display: none; }
.Text-Drawer-Control .Number-01 { background-image: url(../images/text-drawer-number-01.png); }
.Text-Drawer-Control .Number-02 { background-image: url(../images/text-drawer-number-02.png); }
.Text-Drawer-Control .Number-03 { background-image: url(../images/text-drawer-number-03.png); }
.Text-Drawer-Control .Number-04 { background-image: url(../images/text-drawer-number-04.png); }

.Text-Drawer-Control .Intro
{
	margin: 0;
	padding: 0;
	background-color: #fff;
	margin-left: 50px;
}

/*.Drawer-Control-Open .Intro { visibility:hidden; }
*/

.Text-Drawer-Content
{
	padding-left: 50px;
	padding-bottom: 2.3em;
	margin-top: -1.6em;
}

/*
-------------------------------------------------------------------
Icon Drawers
*/

.Icon-Drawer-Control
{
	border-top: 1px solid #ccc;
	padding-top: 0.8em;
}

.Icon-Drawer-Control .Img-Left
{
	border: 2px solid #fff;
	margin-left: -2px;
	margin-bottom: 0;
}

.Icon-Drawer-Control .Drawer-Control-Active .Img-Left { border-color: #fff; }
.Icon-Drawer-Control .Drawer-Control-Open .Sub-Title { color: #333 !important; }

.Icon-Drawer-Content
{
	padding-bottom: 1.4em;
	margin-top: -1em;
}

/*
-------------------------------------------------------------------
Special blocks
*/

.SEO { display: none; }

/*
-------------------------------------------------------------------
Feature text
*/

.hilite { color: #ee2276; }

/*
-------------------------------------------------------------------
Footer
*/

#Nav-Foot
{
	border-top: 1px solid #ccc;
	clear: both;
	list-style: none;
	margin: 4em 144px 0 0;
	padding: 1em 0 4em 0;
	width: 406px;
	float: right;
}

#Nav-Foot li
{
	background-image: none;
	display: inline;
	list-style: none;
	margin: 0 2em 0 0;
	padding: 0;
	font-size: 0.9em;
}

#Nav-Foot li a
{
	text-decoration: none;
	color: #888;
}

#Nav-Foot li a:hover
{
	text-decoration: underline;
	color: #888;
}

/*
-------------------------------------------------------------------
File Help text
*/

.File-Help
{
	display: none;
	padding: 5px;
	border: 1px solid #ddd;
	margin-top: 5px;
	margin-bottom: 5px;
}

.File-Help br { display: none; }

.File-Help span
{
	display: block;
	line-height: 1.1em;
	margin-bottom: 4px;
	color: #999;
}

.File-Help .Main-Title
{
	font-weight: bold;
	margin-bottom: 8px;
	color: #777;
}

.File-Help .Title
{
	font-weight: bold;
	margin-top: 10px;
	color: #777;
}

/*
-------------------------------------------------------------------
Feature Appointment
*/

#Banner
{
	position: absolute;
	top: 0;
	left: 280px;
	width: 406px;
	height: 165px;
	overflow: hidden;
}

#Banner img
{
	position: absolute;
	left: 0;
	bottom: 0;
}