/*  ----------------------------------------------------------------------------------------------------*/

body {
  background: url(../images/site-background.jpg);
  height: auto;
}

#main-content {	
  height: 650px;
}


#header {
  background: url("../images/site-header-background.png") repeat-x;
}


.colright {
  height: 460px;
  position: relative;
}

.contentbox0 {
  padding-top: 20px;
  margin-top: 20px;
}
.contentbox1 {
  border-top: dashed 1px #bababa;
  padding-top: 20px;
  margin-top: 20px;
  
}
.contentbox2 {
  border-top: solid 1px #bababa;
  padding-top: 20px;
  margin-top: 20px;
}

.staffemail {
	position: relative;
	bottom: -3px;
}
.staffbox {
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
}
.stafficon {
  display: block;
  width: 91px;
  height: 91px;
  margin-right: 20px;
  overflow: hidden;
  text-decoration: none;
  background-position: 0px 0px;
  float: left;
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
}
.staffbox .stafficon img {
  opacity:1;
  filter:alpha(opacity=100); /* For IE8 and earlier */
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
}
.staffbox:hover .stafficon img {
  opacity:0;
  filter:alpha(opacity=0); /* For IE8 and earlier */
}
.staffbox img.staffemail {
  opacity:.75;
  filter:alpha(opacity=75); /* For IE8 and earlier */
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
}
.staffbox:hover img.staffemail {
  opacity:100;
  filter:alpha(opacity=100); /* For IE8 and earlier */
}
.stafficon#allan {
  background: no-repeat url("http://richardrobbarchitects.com/images/about-staff-allan-hover.png");
}
.stafficon#michael {
  background: no-repeat url("../images/about-staff-michael-hover.png");
}
.stafficon#nick {
  background: no-repeat url("../images/about-staff-nick-hover.png");
}
.stafficon#richard {
  background: no-repeat url("../images/about-staff-richard-hover.png");
}

.staffbox:hover .stafficon#allan, .staffbox:hover .stafficon#michael, .staffbox:hover .stafficon#nick, .staffbox:hover .stafficon#richard {
}


#navigation-wrapper {
  width: 960px;
  margin: 0 auto;
  height: 350px;
}
#footer-wrapper {
  width:100%;
  background: #FFFFFF;
  margin: 0 auto;
  position: relative;
  padding: 50px 0px 50px 0px;
}
#footer {
  width: 960px;
  margin: 0 auto;
}

#facebook-wrapper {
  width:100%;
  background: #FFFFFF;
  margin: 0 auto;
  padding: 0px 0px 50px 0px;
  border-top: solid 1px #CCC;
  text-align: center;
}
#likebox-wrapper {
  width:960px;
  height: 700px;
  margin: 0 auto;
  text-align: center;
}
.fb-like-box {
	border: none;
	text-align: center;
}

/* site elements  ----------------------------------------------------------------------------------------------------*/

li {
  margin: 0; 
  padding: 0;
 }
 
ul {
  	padding: 0px;
	margin: 0px;
	list-style: none;
}

.spacer20{
  height: 20px;	
}
.spacer40{
  height: 40px;	
}
.spacer60{
  height: 60px;	
}
.spacer80{
  height: 80px;	
}
.spacer100{
  height: 100px;	
}
.spacer160{
  height: 160px;	
}

.fader1 {
  opacity:0.7;
  filter:alpha(opacity=70); /* For IE8 and earlier */
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
}
.fader2 {
  opacity:0.85;
  filter:alpha(opacity=85); /* For IE8 and earlier */
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

.fader1:hover, .fader2:hover {
  opacity:1;
  filter:alpha(opacity=100); /* For IE8 and earlier */
}


/* images ----------------------------------------------------------------------------------------------------*/

#preload {
  display: none;
}

#logo-richardrobbarchitects {
  display: block;
  width: 218px;
  height: 63px;
  overflow: hidden;
  text-decoration: none;
  background: no-repeat url("../images/site-header-logo.png");
  background-position: 0px;
  text-indent: -9999px;
  float: left;
  position: relative;
  left: 0px;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
}
#logo-richardrobbarchitects:hover {
	left: 20px;
}

#icon-social-facebook, #icon-social-googleplus {
  display: block;
  width: 20px;
  height: 20px;
  overflow: hidden;
  text-decoration: none;
  background-position: 0px;
  margin: 25px 15px 0px 0px;
  text-indent: -9999px;
  float: right;
  position: relative;
  top: 18px;
  transition: top 0.3s;
  -webkit-transition: top 0.3s;
}
#icon-social-facebook:hover, #icon-social-googleplus:hover {
  background-position: -20px;
  top: 14px;
}
#icon-social-facebook {
  background: no-repeat url("../images/site-icon-social-facebook.png");
}
#icon-social-googleplus{
  background: no-repeat url("../images/site-icon-social-googleplus.png");
}

#icon-social-rias {
  display: block;
  width: 48px;
  height: 49px;
  overflow: hidden;
  text-decoration: none;
  background: no-repeat url("../images/site-icon-social-rias.png");
  background-position: 0px;
  margin: 0;
  text-indent: -9999px;
  float: right;
  position: relative;
  top: 14px;
  transition: top 0.3s;
  -webkit-transition: top 0.3s;
}
#icon-social-rias:hover {
  background-position: -48px;
  top: 10px;
}

#logo-designhero {
  display: block;
  width: 50px;
  height: 39px;
  overflow: hidden;
  text-decoration: none;
  background: no-repeat url("../images/site-footer-designhero.png");
  background-position: 0px;
  text-indent: -9999px;
  margin: 0 auto;
  margin-top: 20px;
}

#logo-designhero:hover {
  background-position: -50px;
}

#logo-thefeed {
  display: block;
  width: 123px;
  height: 63px;
  margin: 20px auto;
  text-align: center;
  overflow: hidden;
  text-decoration: none;
  background: no-repeat url("../images/site-footer-thefeed.png");
  background-position: 0px;
  text-indent: -9999px;
  position: relative;
  top:-33px;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
}
#logo-thefeed:hover {
  top:-43px;
}

img {
  border: none;
}

.imagebox {
  height: 460px;
  padding: 0px;
  margin: 0px;
}

img.contentimage {
  border: none;
  width: 100%;
}

img.contacticon {
  float: left;
  margin-right: 20px;
}

a.siteicon-location {
  display: block;
  float: right;
  position: relative;
  bottom: 10px;
  width: 25px;
  height: 55px;
  overflow: hidden;
  text-decoration: none;
  background: no-repeat url("../images/site-icon-location.png");
  background-position: 0px;
  text-indent: -9999px;
}

.projectthumb-imagewrapper {
  position: relative;
}
.projectthumb-imagewrapper:hover .projectthumb-textwrapper {
  display: block;
  opacity:1;
  filter:alpha(opacity=100); /* For IE8 and earlier */
  transition: all 0.2s;
  -webkit-transition: all 0.2s;

}
.projectthumb-textwrapper, projectthumb-textwrapper-js {
  padding-top: 10px;
  display: none;
  opacity :0;
  filter:alpha(opacity=0); /* For IE8 and earlier */
  position: absolute;
  bottom: 0px;
  text-align: center; 
}
.projectthumb-positionwrapper,.projectthumb-positionwrapper-js {
  display: table;
  height: 140px;
  width: 140px;
  background:;
  background: #333 url(../images/site-background3.png);
  position: relative;
  overflow: hidden;
  text-align: center; 
   opacity:1;
  filter:alpha(opacity=100); /* For IE8 and earlier */
   transition: all 0.2s;
  -webkit-transition: all 0.2s;


}
.projectthumb-textposition {
  _position: absolute;
  _top: 50%;
  display: table-cell;
  vertical-align: middle;
}
.projectthumblarge-positionwrapper,.projectthumblarge-positionwrapper-js {
  display: table;
  height: 460px;
  width: 620px;
  background: #333 url(../images/site-background3.png);
  position: relative;
  overflow: hidden;
  text-align: center; 
  opacity:1;
  filter:alpha(opacity=100); /* For IE8 and earlier */
  transition: all 0.2s;
  -webkit-transition: all 0.2s;

}