@charset "utf-8";
/* CSS Document */

*{
	margin:0;padding:0;
}
body {
	font-family: 'Ubuntu', sans-serif;
	color:#646464;
}

#bg {
  position: fixed; 
  top: -50%; 
  left: -50%; 
  width: 200%; 
  height: 200%;
  z-index:-9;
}
#bg img {
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  margin: auto; 
  min-width: 50%;
  min-height: 50%;
  z-index:-9;
}


h1,h2,h3,h4,h5 {
	color:#0054a6;
}
h1 {
	font-size: 1.6em;	
	margin-bottom:10px;
}
h2 {
	font-size: 1.3em;	
}
p {
	margin:10px 0;
}
#top {
	height:110px;
	width:100%;	
	background:#fff;
	border-bottom:10px solid #0054a6;
}
#logo {
	background:url(../images/logo.png) center no-repeat;
	width: 228px;
	height: 110px;	
	display:block;
	float:left;
}
#contactDetails{
	float: right;
	padding: 30px 0;
	text-align: right;
	font-weight: 500;
	font-size: 18px;
	color:#0054a6;
}
#contactDetails a{
	color:#0054a6;
	text-decoration:none;	
}
#contactDetails a:hover{
	color:#646464;
	text-decoration:none;	
}
#navBar {
	height:43px;
	width:100%;	
	background:#0054a6;
	border-top:5px solid #FFF;
}

#nav{
	border:none;
	list-style:none;
	margin:0;
	padding:0;
	text-align:center;
	z-index: 999;
	position: relative;
}
#nav li{
	position:relative;
	display:inline;
}
#nav a{
	display:inline-block;
	padding:12px 40px;
	text-decoration:none;
	color:#fff;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#nav a{
		padding:12px 40px 13px 40px !important;
	}
}
#nav ul{
	position:absolute;
	/*top:100%; Uncommenting this makes the dropdowns work in IE7 but looks a little worse in all other browsers. Your call. */
	left:-9999px;
	margin:0;
	padding:0;
	text-align:left;
}
#nav ul li{
	display:block;
	background:#646464;
}
#nav ul li a{
	padding:15px;
	border-bottom:none;
}
#nav ul li:hover{
	background:#0054A6;
	border-bottom:none;
}
#nav li:hover ul{
	left:0;
}
#nav li:hover a{
	text-decoration:none;
	background:#646464;
}
#nav li:hover ul a{
	text-decoration:none;
	background:none;
}
#nav li:hover ul a:hover{
	text-decoration:none;
	background:#0054A6;
}
#nav ul a{
	white-space:nowrap;
	display:block;
	border-bottom:1px solid #ccc;
}

#splash {
	height:350px;
	width:100%;
	background:url(../images/pageimages/contact.jpg) center no-repeat;
	background-size:cover;
}

#Content {
	padding:10px;
	text-align:justify;	
}
#Content ul {
	margin:10px 30px;	
}
.grey{
	color:#646464;
}
.blue{
	color:#0054a6;
}
a.grey:hover{
	color:#0054a6;
}
a.blue:hover{
	color:#646464;
}

.widthHolder {
	width:1000px;	
	margin:0 auto;
}
.IndustriesTextbox{
	float: left;
	width: 504px;
	border: 2px solid #0054A6;
	overflow: hidden;
	padding: 20px;
	background:#fff;
	margin-bottom:20px;
}
.IndustriesTextbox.left{
	border-right: none;
	border-radius: 20px 0px 0px 20px;
}
.IndustriesTextbox.leftalt{
	border-radius: 20px 0px 20px 20px;
}
.IndustriesTextbox.right{
	border-left: none;
	border-radius: 0px 20px 20px 0px;
}
.IndustriesTextbox.rightalt{
	border-radius: 0px 20px 20px 20px;
}


.IndustriesImagebox{
	float:left;	
	margin-bottom:10px;
}
.IndustriesImagebox.left img{
	border: 2px solid #0054A6;
	overflow: hidden;
	border-radius: 20px 0px 20px 20px;
}
.IndustriesImagebox.leftalt img{
border-radius: 20px 0px 0px 20px;
border: 2px solid #0054A6;
border-right: none;
}
.IndustriesImagebox.right img{
	border: 2px solid #0054A6;
	overflow: hidden;
	border-radius: 0px 20px 20px 20px
}
.IndustriesImagebox.rightalt img{
	border: 2px solid #0054A6;
	border-radius: 0px 20px 20px 0px;
	border-left: none;
}

/* SLIDER */

    html, body {
    	height: 100%;
    	padding: 0;
    	margin: 0;
    }     
    #wrapper {
    	width: 100%;
    	min-width: 900px;
    	height: 350px;
    	margin: -250px 0 0 0;
    	position: absolute;
    	top: 0;
		margin-top: 168px;
    	left: 0;
		overflow:hidden;
		z-index: 9;
    }
    #carousel div {
    	height: 500px;
    	float: left;
    }
    #carousel img {
		width: 100%;
    }
    #title {
    	text-align: center;
    	width: 100%;
    	margin-top: -10px;
    	position: absolute;
    	top: 50%;
    }
    #title h3 {
    	text-shadow: 
    		0 3px 3px rgba( 0, 0, 0, 0.3 ),
    		0 -3px 3px rgba( 0, 0, 0, 0.3 ),
    		3px 0 3px rgba( 0, 0, 0, 0.3 ),
    		-3px 0 3px rgba( 0, 0, 0, 0.3 );
     
    	font-size: 50px;
    	font-weight: bold;
    	line-height: 50px;
    	color: #fff;
    	margin: 0;
    }
    #title a {
    	color: #fff;
    }
    #title a:hover {
    	background: rgba( 0, 0, 0, 0.5 );
    	padding: 2px 5px;
    }
    #pager {
    	border-radius: 20px;
    	background: #fff;
    	text-align: center;
    	width: 120px;
    	height: 50px;
    	padding-top: 2px;
    	margin: 235px 0 0 -60px;
    	position: absolute;
    	top: 50%;
    	left: 50%;
    }
    #pager a.selected span {
    	background: #666;
    }
    #pager a {
    	display: inline-block;
    	padding: 5px;
    }
    #pager span {
    	border-radius: 10px;
    	background: #ccc;
    	text-indent: -100px;
    	line-height: 0;
    	display: inline-block;
    	width: 10px;
    	height: 10px;
    	overflow: hidden;
    }
	
	
	#footer{
	font-size:12px;
	text-align:center;
	margin-top: 20px;	
}
.ripeLime{
	position:relative;
	background:url(../images/rl-logo.png) no-repeat left center;
	padding: 20px 0px 20px 60px;
	color:#c6ed17;
	text-transform: uppercase;
	text-align:left;
	width:135px;
	margin:0 auto;
}
.ripeLime a{
	color:#c6ed17;
	text-decoration:none;	
	font-size: 16px;
}
a.rlholder{ 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;
  /* edit: added z-index */
  z-index: 1;
  /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('../images/blank.png');
}