/*================= CSS RESET ==================*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
  outline: 0; 
}
body {
  line-height: 1;
  color: black;
  background: white;
}
ol, ul {
  list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  text-align: left;
  font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}
blockquote, q {
  quotes: "" "";
}

/* ----------------------------------------------
  HTML, BODY, RESETS
---------------------------------------------- */

html { 
  overflow-y: scroll; /* keeps vertical scroll bar in firefox at all times so page doesn't jump around */
  height: 100%;
  }

body {
  background: #fff; /* background colour should be same as content area background colour to ensure WYSIWYG looks same as website */
  padding:0;
  margin:0;
  top:0;
  left: 0;
  font: 14px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
  color:#52575a;
  }
  .BodyStyle { /* use this class to set body background colour so that it does not interfere with the WYSIWYG editor */
    background: #fff;
    }

img, form { /* removes all default formatting on images and forms */
  padding:0;
  margin:0;
  line-height:0;
  }

:focus { outline: none; } /* removes dotted outline from links */

.Clear { clear: both; } /* clears all floats; apply to empty divs */



/* ----------------------------------------------
  STRUCTURE
---------------------------------------------- */
  
/* ---------------------------------------- Header */

#Header { 
  width: 940px;
  height:150px;
  margin: 0 auto;
   }
  
.Logo { 
  float:left; 
  margin:32px 0 0 25px;
  }

    
  
/* ---------------------------------------- Wrapper */

#Wrapper {
  width: 940px;
  margin: 0 auto;
  }  
  

/* ---------------------------------------- Content Area */
  
#Content {
  width:620px;
  float:right;
  }
  
.HomeText {
  font-size:20px;
  line-height:32px;
  }
  
.HomeText em{
  font-size:21px;
  }
  
.BottomPageLinks {
  text-align:center;
  margin-top:30px;
  padding-top:10px;
  border-top:1px solid #bac3c6;
  }
  .BottomPageLinks a{
    padding:0 10px;
    }
    
.ImageFloatLeft {
  float:left;
  line-height:0;
  padding: 5px 20px 0 0;
  }
  .ImageFloatLeft img {
    margin:0;
    }
    
.Caption {
  width:200px;
  background: #D8DDDE;
  }
  .CaptionText {
    padding:8px 0;
    font-size:12px;
    text-align:center;
    }
      
.Brands {
  margin:5px 0 20px 0;
  }
  .Brands td {
    padding: 5px 20px 7px 0;
    text-align:center;
    vertical-align:middle;
    font-size:12px;
    }
    
.Wordmark {
  margin:20px 0;
  }
  
.SelectPrintH2 {
  margin-top:20px;
  }
  
.BottomPageLinks a.Selected {
  font-weight:bold;
  }
  
  
/* ---------------------------------------- Side Bar */
  
#SideBar {
  float:left;
  width: 247px;
  }
  
.SideNav ul {
  list-style: none;
  padding:0;
  margin:0;
  line-height:0;  
  }
  .SideNav li {
    list-style: none;
    padding:0;
    margin:0;
    line-height:0;
    }
  
.SideNav li a {
  display:block;
  float:left;
  margin:0 0 2px 0;
  padding: 14px 0px 0 30px ;
  height:18px;
  width: 217px;
color: #ffffff;
  background: url(../images/sidenav-bk.png) no-repeat;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 13px; }

.SideNav a:hover, SideNav .Selected a {
background-position:-247px 0;
font-style: italic;
padding: 14px 0px 0 15px ;
  width: 242px;
text-decoration: none;
font-family: Times, "Times New Roman", serif;
font-size: 16px; }

/*.SideNav a.Nav-home  {
  background-position:0 0;
  }  
  .SideNav a.Nav-home:hover, .SideNav .Selected a.Nav-home {
    background-position:-247px 0;
    }
    
.SideNav a.Nav-services  {
  background-position:0 -32px;
  }  
  .SideNav a.Nav-services:hover, .SideNav .Selected a.Nav-services  {
    background-position:-247px -32px;
    }
    
.SideNav a.Nav-about-us  {
  background-position:0 -64px;
  }  
  .SideNav a.Nav-about-us:hover, .SideNav .Selected a.Nav-about-us  {
    background-position:-247px -64px;
    }
    
.SideNav a.Nav-case-studies  {
  background-position:0 -96px;
  }  
  .SideNav a.Nav-case-studies:hover, .SideNav .Selected a.Nav-case-studies  {
    background-position:-247px -96px;
    }
    
.SideNav a.Nav-blog  {
  background-position:0 -128px;
  }  
  .SideNav a.Nav-blog:hover, .SideNav .Selected a.Nav-blog  {
    background-position:-247px -128px;
    }

.SideNav a.Nav-contact-us  {
  background-position:0 -160px;
  }  
  .SideNav a.Nav-contact-us:hover, .SideNav .Selected a.Nav-contact-us  {
    background-position:-247px -160px;
    }*/
  
.BlogCallout img{
  margin:60px 0 0 13px;
  }



/*
* {
padding:0;
margin:0;
text-decoration:none;
list-style-type:none;
}
body {
background-color: #005167;
}
a img{
border:none;
}
.clear{
clear:both;
margin:0;
height:0;
font-size:0;
}
#container{
width: 950px;
margin: 0 auto;
}
/*--------------------- TOP ---------------------------
#top{
height: 140px;
padding-top: 4px;
background-color: #007496;
color: #333366; }

#top h1{
  margin-left: 35px;
  margin-top: 20px;
  font-size: 36px;
}
#top h2{
  margin-left: 35px;
  font-size: 14px;
 }
/*---------------------TOP RIGHT SIDE TOP (SUBMENU) ---------------------------
#top ul.level-1 {
color: #fff;
float: right;
padding-right: 20px; }

#top ul.level-1 li{
  color: #fff;
  float: left;
  border-right-width: 1px;
  border-right-style: none;
  border-right-color: #FFFFFF;
  padding-right: 7px;
  padding-left: 7px;
}

#top ul.level-1 li a{
color: #fff;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 11px; }
#top ul.level-1 li.active a{
color:#ca6f2c;
}


#top ul.level-1 li a:hover{
text-decoration:underline;
}

#top h1, #top h2 {
color: #fff; }

/*--------------------- MAIN NAVIGATION ---------------------------
#top ul.main-nav{
background:no-repeat left top;
height: 26px;
padding-left: 50px;
padding-top:10px;
float: right;
}
#top ul.main-nav li{
  color:#fff;
  margin-right: 25px;
  float:left;
  font-size: 16px;
}
#top ul.main-nav li a{
color:#fff;
}
#top ul.main-nav li.active a{
color:#ca6f2c;
}
#top ul.main-nav li a:hover{
text-decoration:underline;
}

/*--------------------- CONTENT ---------------------------
#content{
  clear:left;
  background-image: url(../images/background.gif);
  background-repeat: repeat-y;
}

#full-content {
width: 900px;
padding-top: 15px;
padding-bottom: 25px;
padding-left: 25px;
padding-right: 25px;
min-height: 400px;
float:right;
background-color: #fff;
}


/*---------------------CONTENT LEFT SIDE ---------------------------
#content .left-side{
  background: #49aab9 left top;
  width: 219px;
  float:left;
}
/*---------------------left - sub navigation---------------------------
#content .left-side ul.level-2{
margin: 52px 0;
width: 219px;
}
#content .left-side ul.level-2 li{
margin-bottom: -5px;
}
html>body #content .left-side ul.level-2 li{
  margin-bottom: 10px;
}
ul.level-2 li a {
  color: #fff;
   font-size:1.1em;
   padding: 3px 10px 3px 17px;
  display:block;
  font-family: Arial, Verdana, sans-serif;
} 
ul.level-2 li a:hover{
background-color:#297293;
display:block;
color: #ffffff;
}
ul.level-2 li.active a {
background-color: #e7f2f4;
display:block;
color: #ca6f2c;
}

ul.level-2 li.active a:hover{
background-color: #297293;
display:block;
}
/*---------------------left - sub navigation 2nd level---------------------------


html>body #content .left-side ul.level-2 li.sub ul li a {
  margin-bottom: 0;
  display: block;
}
 
ul.level-2 li.sub ul li {
margin-bottom: 0px !important;
 }

ul.level-2 li.sub ul li a {
color: #fff;
display:inline;
padding: 0;
font-size: 12px;
margin-left: 25px;
padding-left: 5px;
margin-right: 0px;
}
ul.level-2 li.sub ul li.active a {
color: #ca6f2c;

}

ul.level-2 li.sub ul li a:hover {
display:inline;
background-color: #297293;

padding:0 0 0 5px !important;
} 
#sidebar li.sub { margin-top: }
#sidebar li.sub[class] { margin-top: 0; }
*:first-child + html #sidebar li.sub { margin-top: -15px; }




/*---------------------content right side---------------------------
#content .right-side{
width: 675px;
padding-top: 15px;
padding-bottom: 25px;
padding-left: 25px;
padding-right: 25px;
min-height: 400px;
float:right;
background-color: #fff;
}

/******* FOOTER *********

#footer{
  background: #007496 no-repeat left top;
  height: 18px;
  padding-bottom: 10px;
  color: #FFFFFF;
  padding-top: 10px;
  font-family: Helvetica, sans-serif;
  font-size: 10px;
  text-align: center;
}

#footer a {
  color: #CC6600;
}
#container #footer a:hover {
  text-decoration: underline;
 }

#footerlinks #admin_link {
overflow: hidden;
background: url(../images/admin-button.gif) no-repeat;
background-position: center;
width: 90px;
height: 25px;
float: left;
margin-right: 1em;
font-size: 0px;
text-align: center; }

#footerlinks #edit_link {
font-size: 0px;
overflow: hidden;
background: url(../images/edit-button.gif) no-repeat;
background-position: center;
width: 90px;
height: 25px;
display: block;
float: right;
}

/******** SITEMAP MODULE ********

#sitemap li.sub{
list-style-type: none;
}
*/

/******** GALLERY MODULE ********/
#photo h1{
  text-align: center;
        margin-bottom: 0.5em !important;
  }
#photo .navigation{
  height: 75px;
  text-align: center;
  width: 400px;
  margin: 0 auto;
  }  
  #photo .previous, #photo .next{
    padding: 0px;
    display: block;
    width: 40px;
    height: 25px;
  }
  #photo .previous{
    float: left;
    background: url(/images/previous.gif) no-repeat;
  }
  #photo .next{
    float: right;
    background: url(/images/next.gif) no-repeat;
  }
        #photo .back{
          font-size: 0.9em;
                color: #aaa;
                text-decoration: none;
        }
        #photo .back:hover{
          text-decoration: underline;
        }
  #photo p{
    margin: 0 0 10px 0;
  }
  #photo .image{
    clear: both;
    text-align: center;
  }
  #photo .image img{
    border: 1px solid #111;
  }
        #photo .description{
     width:400px; 
                margin: 1em auto; 
                font-size:0.9em; 
                text-align: center;
        }
#gallery {
margin-left: 50px; }

#gallery ul{
  margin: 0;
  padding: 0;
}
  #content .right-side #gallery ul li{
    margin: 0 5px 5px 0;
    list-style-type: none;
    float: left;
    width: 150px;
    height: 155px;
    line-height: 150px;
    text-align: center;
    border: 1px solid #ccc;
    background-color: #b4cbf0;
  }

  #gallery ul li:hover{
      border: 1px solid #aaa;

  }


#content .right-side #gallery li img{
    vertical-align: middle;
    border-top: 0px solid #000;
    border-bottom: 0px solid #000;
  }
/* ---------------------------------------- Footer*/

#Footer { 
  width:940px;
  margin: 0 auto;
  margin-top:40px;
  height:95px;
  background:url(../../images/footer-arrow.png) no-repeat top right;
border-top: 1px #ddd solid; }
#footerlinks #admin_link {
overflow: hidden;
background-position: center;
width: 90px;
height: 25px;
float: left;
margin-right: 1em;
font-size: 0px;
text-align: center; }

#footerlinks #edit_link {
font-size: 0px;
overflow: hidden;
background-position: center;
width: 90px;
height: 25px;
display: block;
float: right;
}
.SocialMedia {
  padding-top:15px;
padding-right: 25px;
  font: 12px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
  color:#52575a;
  text-align:right;
  }
.SocialMedia img {
padding: 3px;
}   
.Copyright {
  padding-top:15px;
  font: 12px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
  color:#52575a;
  text-align:right;
  }
  
  
.RKD {  
  margin-top:25px;
  font: 12px/22px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
  color:#bac3c6;
  text-align:right;
  }

.RKD a:link, .RKD a:visited, .RKD a:hover, .RKD a:active {
  color:#bac3c6;
  text-decoration: none;
  }


