body{
	/*background:url(../images/bg.png) no-repeat center top;*/
	margin:0px auto;
	padding:0px;
	font-family: 'OpenSansRegular';
	

  /* fallback */
  background-color: #2F2727;
  background-image: url(images/radial_bg.png);
  background-position: center center;
  background-repeat: no-repeat;

  /* Safari 4-5, Chrome 1-9 */
  /* Can't specify a percentage size? Laaaaaame. */
  background: -webkit-gradient(radial, center center, 0, center center, 460, from(#4593d8), to(#2F2727));

  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(circle, #4593d8, #2F2727);

  /* Firefox 3.6+ */
  background: -moz-radial-gradient(circle, #4593d8, #2F2727);

  /* IE 10 */
  background: -ms-radial-gradient(circle, #4593d8, #2F2727);

  /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */

}
.wrapper{
	width:980px;
	padding:0px;
	margin:0px auto;
}
.container{
	margin:50px 0px 30px 0px;
	width:100%;
	float:left;
}


/* logo */
#logo{
	width:290px;
	margin:0px;
	float:left;
}

/** clearfix **/
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
 
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

/* blocks */
.block-1{
	margin:0px 2px 2px 0px;
	float:left;
	height:160px;
}
.color-yellow, .color-red, .color-green, .color-orange, .color-orange-2, .color-pink, .color-blue, .color-o-green{
	height:160px;
}
.color-yellow{
	background:#fece3c;
}
.color-red{
	background:#c23916;
}
.color-green{
	background:#6fa014;
}
.color-orange{
	background:#fe8503;
}
.color-orange-2{
	background:#f4b800;
}
.color-whire{
	background:#fff;
}
.color-pink{
	background:#91009b;
}
.color-blue{
	background:#0097aa;
}
.color-o-green{
	background:#94c849;
}
.color-white{
	background: rgba(63, 109, 157, 0.2);
	padding:15px;
	border-radius:4px;
}

/* bg for popover */
.bg-yellow{
	background:#fece3c;
}
.bg-red{
	background:#c23916;
}
.bg-green{
	background:#6fa014;
}
.bg-o-green{
	background:#94c849;
}
.bg-orange{
	background:#fe8503;
}
.bg-orange-2{
	background:#f4b800;
}
.bg-blue{
	background:#0097aa;
}
.bg-green{
	background:#94c849;
}

.nav-home a, .nav-home h1{
	text-align:center !important;
	font-family: 'OpenSansLight';
	color:#FFF;
	padding-top:20px;
	font-size:50px;
	line-height:0px;
	text-decoration:none;
	font-weight:normal;
}
.nav-home h3{
	font-size:15px;
	color:#FFF;
	line-height:0px;
}
/* -------------- */
.nav-home h2{
	text-align:center !important;
	font-family: 'OpenSansLight';
	color:#FFF;
	padding-top:50px;
	font-size:50px;
	line-height:0px;
	text-decoration:none;
	font-weight:normal;
}
.nav-home h4{
	font-size:13px;
	color:#FFF;
	line-height:130px;
	text-align:left;
	padding-left:5px;
}



/* overlay */
/* Overlay style */
.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(153,204,51,0.9);
}
.xl{
	font-size:28px;
	width:40px;
	color:#FFF;
	height:40px;
	border-radius:50px;
	border:1px solid #FFF;
	padding:5px;
	margin-top:17px;
}
.copy-rights{
	margin-top:10px;
	padding:15px 0px;
	font-size:12px;
	color:#FFF;
}
.copy-rights img{
	margin-top:-10px;
}


.promo-title h2{
	font-family: 'OpenSansBold';
	font-size:26px;
	font-weight:normal;
}

.caption-text{
	text-align:right !important; 
	font-size:13px;
	font-family: 'OpenSansLightItalic';
	padding:0px 0px 10px 0px;
	color:#fff;
	padding-right:50px;
	float:right;
	width:100%;
}
.style3 {
  font: 18px/30px normal Tahoma, sans-serif;
  padding-top: 22px;
  margin: 5px;
  background-image: url(images/openquote3.gif);
  background-position: top left;
  background-repeat: no-repeat;
  text-indent: 65px;
  }
.style3 span {
    display: block;
    background-image: url(images/closequote3.gif);
    background-repeat: no-repeat;
    background-position: bottom right;
} 



/* page loading animation for features page */
/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
.fade-in {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
}
 
.fade-in.one {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 
.fade-in.two {
-webkit-animation-delay: 1.2s;
-moz-animation-delay:1.2s;
animation-delay: 1.2s;
}
 
.fade-in.three {
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
animation-delay: 1.6s;
}


.map{
	width:100%;
	height:300px;
	margin:0px;
	padding:5px;
	border:1px solid rgba(255,255,255,0.5);
	border-radius:3px;
}




/* features */
.feature-1{
	height:300px;
	float:left;
	display:block;
	margin:0px 10px 10px 0px;
}
.feature-2{
	height:300px;
	display:block;
	float:left;
	margin:0px 10px 10px 0px;
}










#galleryContainer {
  width: 100%;
  height: 800px;        /* Image height + 200px */
  overflow: hidden;
  position: absolute;
  top: 250px;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  z-index: 1;
  left:0;
}


/*
  The gallery div that contains all the images

  We'll set the width dynamically in the JavaScript as the images load
*/

#gallery {
  width: 100px;
  height: 500px;        /* Image height + 100px */
  padding: 50px 0;
  position: absolute;
  z-index: 1;
}


/*
  Individual slides within the gallery:

  Float them left so that they're all side by side
  Fixed height (the width will vary as required)
  Add some horizontal margin between the slides
  Add a bottom fading reflection for WebKit browsers
*/

#gallery img {
  float: left;
  height: 600px;
  margin: 0 100px;      /* Adjust the left/right margin to show greater or fewer slides at once */
  -webkit-box-reflect:
    below
    0
    -webkit-gradient(
      linear,
      left top,
      left bottom,
      color-stop(1, rgba(255, 255, 255, .5)),
      color-stop(.8, rgba(255, 255, 255, 0))
    );
}


/*
  Left and right buttons:

  Position them on the left and right sides of the gallery
  Stretch them to the height of the gallery
  Hide them by default
*/

#leftButton, #rightButton {
  position: absolute;
  z-index: 2;
  top: -100px;
  bottom: 0;
  padding: 0;
  margin: auto 0;
  width: 15%;
  height: 600px;        /* Image height */
  border: none;
  outline: none;
  color: #fff;
  background: transparent url(images/blank.gif);
  font-size: 100px;
  font-family: "Courier New", courier, fixed;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity .5s;
  -moz-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
}

#leftButton {
  left: 0;
}

#rightButton {
  right: 0;
}

/* (Turn off dotted black outline on FF3) */

#leftButton::-moz-focus-inner, #rightButton::-moz-focus-inner {
  border: none;
}

/*
  Left and right button hover states:
  Fade them in to 50% opacity
*/

#leftButton:hover, #rightButton:hover {
  opacity: .5;
  filter: alpha(opacity=50);
  outline: none;
}


/*
  Image caption:

  Position just under the centre image
  Hide by default
*/

#caption {
  position: absolute;
  z-index: 2;
  bottom: 90px;
  width: 100%;
  color: #ffc;
  text-align: center;
  font-family: "Georgia", serif;
  font-size: 24px;
  letter-spacing: .1em;
  display: none;
}


/*
  Loading text:

  Position in the centre of the gallery container
  Hide by default
*/

#loading {
  position: absolute;
  z-index: 1;
  bottom: 50%;
  width: 100%;
  color: #ffc;
  text-align: center;
  font-family: "Georgia", serif;
  font-size: 36px;
  letter-spacing: .1em;
  opacity: 0;
  filter: alpha(opacity=0);
}

