body {background: #cb9f5b;}

a:link {color: #5d3a00}
a:visited {color: #5d3a00}
a:hover {color: #900}
a:active {color: #900}

.grid {padding-right: 20px;}

.cleared {
	zoom: 1;
}

.cleared:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#container {background: url(/site/img/face/bg-header.gif) 0 57px no-repeat;}

#grad {background:  url(/site/img/face/bg-grad.jpg) 60% 55px no-repeat;}

#header {
  margin: 0 0 0 20px;
  padding: 0;
  background: url(/site/img/face/corner.png) right top no-repeat;
  height: 200px;
}

#logo {margin-left: 12.5%;}

#top-nav {
  width: 70%;
  padding: 0;
  margin: 0;
  position: static;
  background: none;
  height: 200px;
}

#top-nav .grid {  
  padding: 0 0 0 84px;
  background: url(/site/img/face/bg-top-left.png) top left no-repeat;
  margin:0 0 0 -84px;
}

#main-nav {
  position: relative;
  height: 94px;
  margin: 0 62px 0 0;
  padding: 60px 0 0 0;
  background: url(/site/img/face/bg-top-right.png) top right no-repeat;
}

#main-nav li {
    background: none;
}

#face-service {
    margin: 0 0 0 20px;        
}

#service {  
  width: 20%;
  float: left;
  padding-bottom: 100px;
}

#service h2 {
  font-style: italic;
  font-size: 1.250em;
  color: #333;
  margin: 0 0 3px 0;
}

#service ul {
  font-size: 0.875em;
  list-style: none;
}

#service li {
  zoom: 1;
  background: none;
  padding: 7px 0px 7px 21px;
}

#service .current span {
  display: block;
  border: 1px solid #b28b4d;
  border-right: none;
  padding: 6px 40px 6px 20px;
}

#service .current {  
  position: relative;
  margin-right: -40px;
  overflow: hidden;
  padding: 0;
}

#service .current div {
  position: absolute;
  right: 0px;
  width: 40px;
  background: url(/site/img/face/triangle.png) 100% 50% no-repeat;
  height: 200px;
  top: 50%;
  margin-top: -100px;
}

#service a:link {color: #5d3a00}
#service a:visited {color: #5d3a00}
#service a:hover {color: #900}
#service a:active {color: #900}


#talking-man {
  width: 50%;
  float: left;
  font-size: 0.750em;
}

.bubble {
  margin: 0 10% 0 20%;
  padding:  0 0 200px 0;
  background: url(/site/img/face/man-01.png) 50% 100% no-repeat;
}

.bubble .grid {
  display: none;
  position: relative;
  left: -20px;
  margin: 0;
  background: #bb8f4a;
  padding: 20px;
}

.bubble p {
  margin: 0;
}

.bubble .service-01 {
  display: block;
}

.bubble h3 {
  margin: 0 0 0.3em 0 ;
}

#projects {
  width: 30%;
  float: left;
  padding-top: 20px;
  
}

html>body #projects {
  *margin-right: -1px;
}

.completed-projects {
  margin-bottom: 40px;
  padding-bottom: 60px;
  font-style: italic;
  font-size: 1.250em;  
  background: url(/site/img/face/pinoccio.png) 133px 100% no-repeat;
  zoom: 1;
}

.completed-projects span {
  display: block;
}

.features {
  font-size: 0.875em;
  padding-right: 20px;
}

.features img {
  display: block;
}

#events-box {
  margin-left: 20px;  
  margin-bottom: 70px;
}

#info {
  width: 40%;
  float: left;
}

#info .grid {
  padding: 0 25%;
  margin: 0;
}

#info ul {
  position: relative;
  left: -45px;
  margin: 0;
  padding: 5px 0 0 0;
  font-size: 0.875em;

}

#info li {
  padding: 0 0 30px 45px;
}

#info .vacancy {
  margin: 0;  
  width: auto;
  background: url(/site/img/face/ico-vacancy.png) left top no-repeat;
}

#info .pdf {
  background: url(/site/img/face/ico-pdf.png) left top no-repeat;
}

#info em {
  display: block;
  font-style: normal;
}

#events {
  width: 60%;
  float: left;
}

#events h2 {
  margin-top: 0;
  font-size: 1.250em;
  font-style: italic;
}

#events h4 {
  margin: 0 0 3px 0;
  font-size:0.786em;
  font-style: italic;
  color: #71634c;
}

#events .col3 {
  font-size: 0.875em
}

#portfolio {
  overflow: hidden;
  position: relative;
  height: 265px;
  background: url(/site/img/face/bg-works.png) repeat-x;
  margin-bottom: 30px;
  padding-left:64px;
  padding-right:64px;
}

#portfolio p {
  padding: 35px 0 0 20px;
  margin: 0;
  font-size: 1.250em;
  font-style: italic;
  color: #333;
}

#portfolio p a:link {color: #ccc;}
#portfolio p a:visited {color: #ccc;}
#portfolio p a:hover {color: #900;}
#portfolio p a:active {color: #900;}

#portfolio .btn-left,
#portfolio .btn-right {
  position: absolute;
  top: 124px;
  width: 16px;
  height: 20px;
}

#portfolio .btn-left {
  left: 28px;
}

#portfolio .btn-right {
  margin-left: 100%;
  left: -44px;
}

.gallery {
  overflow: hidden;
  height: 175px;
  width: 100%;
  position: relative;
  zoom:1;
}

.gallery .holder {
 position: relative;
 zoom: 1;
}

.gallery .element {
  float: left;
  width: 180px;
  height: 155px;
  padding: 16px 16px 0;
  font-size: 0.750em;
  color: #fff;
}

.gallery .element a {
  text-decoration: none;
  zoom: 1;
}

.gallery .element img {
  display: block;
  padding: 3px;
}

.gallery .element span {
  text-decoration: underline;
  position: relative; left: 4px;
}

.gallery .element a:link {color: #fff;}
.gallery .element a:visited {color: #fff;}
.gallery .element a:hover {color: #900;}
.gallery .element a:active {color: #900;}

.gallery .element a:link img {border: 1px solid #000;}
.gallery .element a:visited img {border: 1px solid #000;}
.gallery .element a:hover img {border: 1px solid #900;}
.gallery .element a:active img {border: 1px solid #900;}

#footer {
  margin: 0 0 0 20px;
  border: none;
}

#footer .copy {
  width: 30%;
}

#footer address {
  width: 30%;
  margin: 0;
}

#footer .foot-links {
  width: 20%;
}

.foot-links span {
  display: block;
  margin: 0 0 8px;
}

.foot-links a {
  float: none;
  margin: 0;
}

#footer {
  padding-top: 30px;
 
}

#footer .border {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 5px;
  font-size: 0;
  background: #000;
  width: 100%;
  margin-left: -20px;
}

#footer .search {
  width: 20%;
  margin: 0;
}

#footer .search fieldset {
  margin-right: 20px;
}

#v-marketing {
  margin: 25px 0 25px 20px;
  font-size: 0.750em;
  zoom: 1;
}

#v-marketing:after {
  content: ' ';
  height: 0;
  font-size: 0;
  display:block;
  clear: both;
}


#v-marketing .col {
  float: left;
  width: 30%;
}

#v-marketing .col .wrap {
  margin-right: 20px;
}

#v-marketing h1 {
  font-size: 1.667em;
  font-style: italic;
  font-weight: normal;
  margin: 0 0 0.3em;
  color: #000;
}

/* ie6 hack */
* html #top-nav .grid {
  position: relative;
  left: -84px;
  margin: 0 -84px 0 0;
}

* html #footer .search input {
  position: relative;
  left: 20px;
}

* html #face-service {
  position: relative;
}

* html #projects {
  margin-right: -1px;
}

* html #service .current {
margin-bottom: 9px;
}

* html #events {
  margin-right: -1px;
}

* html #info,
* html #info .grid,
* html #info .grid ul {
  position: relative;
  zoom: 1;
}

