body
{
background-color:#1f2227;
padding: 0;
margin: 0;
font-family: 'Open Sans','Helvetica Neue', Arial, sans-serif;
}


#wrap { 
	width: 1330px;
	margin: 0 auto; 
}


#nav {
	width: 100%;
	height: 60px;
	float: left;
	margin: 0 0 1m 0;
	padding: 0;
	margin: 0;
	background-color: #1c1f23;
	border-bottom: 0px solid #1c1f23;  }

#showmenu
{
  display: block;
  width: 60px;
  height: 60px;
  background: url("img/menubar/menuoff.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:8;
  margin-left: 15px;

}

#showmenu:hover
{ 
  background: url("img/menubar/menuon.png") no-repeat 0 0;
  position:absolute;
  z-index:9;
}

#home
{
  display: block;
  width: 550px;
  height: 60px;
  background: url("img/menubar/homeoff.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:4;
  margin-left: 75px;

}

#home:hover
{ 
  background: url("img/menubar/homeon.png") no-repeat 0 0;
  position:absolute;
  z-index:4;
}

#about
{
  display: block;
  width: 550px;
  height: 60px;
  background: url("img/menubar/aboutoff.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:5;
  margin-left: 135px;

}

#about:hover
{ 
  background: url("img/menubar/abouton.png") no-repeat 0 0;
  position:absolute;
  z-index:5;
}

#work
{
  display: block;
  width: 550px;
  height: 60px;
  background: url("img/menubar/workon2.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:6;
  margin-left: 195px;

}

#work:hover
{ 
  background: url("img/menubar/workon.png") no-repeat 0 0;
  position:absolute;
  z-index:6;
}

#people
{
  display: block;
  width: 550px;
  height: 60px;
  background: url("img/menubar/peopleoff.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:7;
  margin-left: 255px;

}

#people:hover
{ 
  background: url("img/menubar/peopleon.png") no-repeat 0 0;
  position:absolute;
  z-index:7;
}

#contact
{
  display: block;
  width: 550px;
  height: 60px;
  background: url("img/menubar/contactoff.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:8;
  margin-left: 315px;
  
}

#contact:hover
{ 
  background: url("img/menubar/contacton.png") no-repeat 0 0;
  position:absolute;
  z-index:8;
}

#separator
{
  display: block;
  width: 60px;
  height: 60px;
  background: url("img/menubar/separator.png") no-repeat 0 0;
  margin: 0;
  padding: 0;
  position:absolute;
  z-index:3;
  margin-left: 360px;

}

#showreel
{
position: absolute;
   top: 50%;
   left: 50%;
   
   margin-top: -360px; /* Half the height */
   margin-left: -530px; /* Half the width */
   
}

I#video-gallery {
  width: 100%;
}

.videoGallery .rsTmb {
  padding: 20px;
}
.videoGallery .rsThumbs .rsThumb {
  width: 220px;
  height: 80px;
  border-bottom: 1px solid #2E2E2E;
}
.videoGallery .rsThumbs {
  width: 220px;
  padding: 0;
}
.videoGallery .rsThumb:hover {
  background: #000;
}
.videoGallery .rsThumb.rsNavSelected {
  background-color: #02874A;
  border-bottom:-color #02874A;
}

.sampleBlock {
  left: 3%; 
  top: 1%; 
  width: 100%;
  max-width: 400px;
}


@media screen and (min-width: 0px) and (max-width: 500px) {
  .videoGallery .rsTmb {
    padding: 6px 8px;
  }
  .videoGallery .rsTmb h5 {
    font-size: 12px;
    line-height: 17px;
  }
  .videoGallery .rsThumbs.rsThumbsVer {
    width: 100px;
    padding: 0;
  }
  .videoGallery .rsThumbs .rsThumb {
    width: 100px;
    height: 47px;
  }
  .videoGallery .rsTmb span {
    display: none;
  }
  .videoGallery .rsOverflow,
  .royalSlider.videoGallery {
    height: 300px !important;
  }
  .sampleBlock {
    font-size: 14px;
  }
}
