@import url('reset.css');

img, div { behavior: url(iepngfix.htc) }
/* Global */

body {
    background: url(images/framework/body-bg.gif) repeat-x;
    font-family: verdana, arial, sans-serif;
    font-size: 80%;
}

.flow {
    width: 836px;
    margin: auto;
    padding-left: 10px;
    padding-right: 10px;
}

#header img.logo {
    margin:20px 0 0;
}

#header img.logo:hover {
    opacity: 0.5;
}

a {
    color:#564d82;
    text-decoration: none;
}
h1 {
    font-size: 2.5em;
    margin-bottom: 20px;
}

h2 {
    color: #564D82;
    font-size: 1.8em;
    border-bottom: 1px solid #564d82;
    padding-bottom: 15px;
    margin-bottom:30px;
}

h3 {
    font-size: 1.4em;
    margin-bottom: 15px;
}
@font-face {
    font-family: "Apex Sans Medium";
    src: url(ApexSans-Medium.otf) format("opentype");
}

@font-face {
    font-family: "Apex Sans Book";
    src: url(ApexSans-Book.otf) format("opentype");
}
.hide {
    display: none;
}

.show {
    display: block;
}
/* Navigation */

#navigation {
    margin-bottom: 10px;
    font-family: "Apex Sans Book", verdana, arial, sans-serif;

}

#navigation .flow{
    border-bottom:1px solid #564d82;
    margin-bottom:20px;
    padding:20px 0;
}

#navigation li{
    float:left;
    margin-right:40px;
    text-transform:uppercase;
}

.bookend {
    margin-right: 0 !important;
}

#navigation li a {
    text-decoration: none;
    color: #99999c;
    font-size: 12.8px;
}

#navigation li.active a {
    color: #000;
}

#navigation li:hover a{
    color: #564d82;
}

#navigation li.arenaLink a {
    color: #564d82;
}
/* Main Header */
#title {

}
#title h1 {
    background:url("images/framework/main-title.gif") no-repeat scroll 0 0 transparent;
    display:block;
    height:28px;
    width:100%;
}

#title h1 span {
    display: none;
}

/* intro */
#intro {
	height: 76px;	
}
#intro .flow p{
    margin-bottom:20px;
    font-size: 17.8px;
    line-height: 1.6;
    font-family: "Apex Sans Book", verdana, arial, sans-serif;
}

#intro .flow p a {
    color: #564d82;
    text-decoration: none;
}

#intro .flow p a:hover {
    color: #564d82;
    text-decoration: underline;

}

/* Content */

.columnLeft {
    width: 337px;
    float: left;
}

.columnLeft p{
    margin-bottom: 10px;
    line-height: 1.8;
    text-align: justify;
    font-size: 0.857em;
    color: #505050;

}

/* footer */

#footer .flow {
    border-top:1px solid #564d82;
    color:#505050;
    font-size:0.857em;
    margin-bottom:30px;
    margin-top:20px;
    padding-left:0;
    padding-right:0;
    padding-top:20px;
    width:836px;
}

/* Circle Functionality */
.hide {
    /*display:none;*/
}

.circleNavigation {
    float:right;
    height:444px;
    position:relative;
    width:498px;
}
.circleNavigation a.circleA {
    display:block;
    height:143px;
    left:74px;
    position:absolute;
    top:41px;
    width:143px;
}
.circleNavigation a.circleB {
    display:block;
    height:182px;
    left:247px;
    position:absolute;
    top:20px;
    width:181px;
}
.circleNavigation a.circleC {
    display:block;
    height:168px;
    left:122px;
    position:absolute;
    top:191px;
    width:167px;
}
.circleNavigation a.circleD {
    display:block;
    height:152px;
    left:305px;
    position:absolute;
    top:142px;
    width:152px;
}
.circleNavigation a span{
    display: none;
}

.circleNavigation{
    background:url("images/circles/circle-background.gif") no-repeat scroll 72px 0 transparent;

}
/* Client & Work */

#ourWork {
    margin-bottom: 20px;
    float: left;
}
#ourWork li {
    float:left;
    margin-right:71px;
}
#clientLogos {
    display:block;
    height:57px;
    margin-bottom:15px;
    overflow:hidden;
    width:100%;
}
#clientLogos li{
    float: left;
    margin-right: 17px;
    height: 60px;
  	width: 60px;
}
.portfolioImage {
    float: right;
}


/* Management Team */

#peopleHolder {
	position: relative;
}
#peopleHolder div {
}

ul#smallImages {
    margin-bottom: 60px;
    float: left;
}
ul#smallImages li{
    float:left;
    margin-right: 10px;
}
#profileImageHolder {
	position: relative;
	float: right;
	width: 330px;
	height: 330px;
}

.largeImage {
	position: absolute;
	top: 0px;
	right: 0px;
}
.email {
    line-height: 4;
}

/* News */

.newsColumn {
    width: 552px;
    float: left;
    margin-right: 20px;
    color:#505050;

 
}

.newsColumn p {
       line-height: 1.8;
}

.newsColumn h2 {
    border: none;
       padding: 0;
   margin: 0;

}

.newsColumn p.date {
    margin-bottom: 20px;
    color: #6c6c6c;
}

.sideBar {
    float:right;
    width:243px;
}

.post {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

.post p {
    margin-bottom: 10px;
}
.archiveWidget li {
    margin-bottom: 20px;
    text-decoration: none;
    list-style-type: disc;
    list-style-image: url('images/news/archive-bullet.gif');
    list-style-position: inside;

}
.archiveWidget li a {


    color:#000;
    text-decoration: none;
}

.archiveWidget h2{
    border-bottom: none;
    background: red;
}
.archiveWidget li a:hover {
   color:  #DE2939
}
.newsPic {
    float:right;
    margin-left: 20px;
	max-width: 300px;
    clear: both;
}
a.readMore {
    color:#564d82;
    text-decoration: none;
}


.columnLeft h2{
    border: none;
    padding: 0;
    margin-top: 20px;
    margin-bottom: 20px;   
}

.contact .columnLeft p {
    font-size: 14px;
}
.contact a {
       font-size: 14px;
}

.contact .map{
    float: right;
}

/* vacancies */

#vacancies .columnLeft p {
    text-align: left !important;
}
.contact .columnLeft p {
    font-size: 0.857em;
}
/* Clearfix */

.clearfix:after,
.flow:after,
.post:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    zoom: 1;
}
#contentHolder {
	position: relative;
}
#contentHolder div {
}