/***********************************************
*
* Bowcliffe Stylesheet
*
***********************************************/


/***********************************************
*
* 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,
b, u, i, center,
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-size: 100%;
   vertical-align: baseline;
   background: transparent;
}
body {
   margin: 0;

   background: #E6E6E6;

   font-family: Arial, Helvetica, sans-serif;
   font-size: 1em;
   font-style: normal;
   font-weight: normal;
   text-transform: none;
   color: #000000;
   line-height: 1;
}
ol, ul {
   list-style: none;
}
blockquote, q {
   quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
   content: '';
   content: none;
}

/* remember to define focus styles! */
:focus {
   outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
   text-decoration: none;
}
del {
   text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
   border-collapse: collapse;
   border-spacing: 0;
}

p {
   margin: 0;
}

a {
   text-decoration: none;
   color: #FF3300;
}

/***********************************************
*
* Containers
*
***********************************************/

div#header-menu {
   width: 100%;
   height: 40px;
   background: #E6E6E6 url(../images/assets/header-menu-background-tile.jpg) repeat-x left top;
}

div#header-menu div.container-centered {
   margin: 0 auto 0 auto;
   width: 880px;
}

div#header-menu div.contact {
   float: left;
}

div#header-menu div.contact p {
   float: left;
   margin: 15px 22px 0 0;
   font-size: 0.75em;
   font-weight: bold;
}

div#header-menu div.menu {
   float: right;
}

div#header-menu div.menu ul {
   margin: 15px 0 0 0;
}

div#header-menu div.menu ul li {
   float: left;
   margin: 0 0 0 18px;
}

div#header-menu div.menu ul li a {
   display: block;
   height: 25px;
   font-size: 0.7em;
   font-weight: bold;
   text-transform: uppercase;
}

div#header-menu div.menu ul li a.selected,
div#header-menu div.menu ul li a:hover {
   background: url(../images/assets/header-menu-selected-background.jpg) no-repeat center bottom;
   color: #000000;
}

div#main-menu {
   clear: both;
   width: 100%;
   height: 130px;
   background: #FFFFFF;
}

div#main-menu.red-strip {
   clear: both;
   width: 100%;
   height: 165px;
   background: #FFFFFF url(../images/assets/main-menu-background-tile.png) repeat-x left top;
}

div#main-menu div.container-centered {
   position: relative;
   margin: 0 auto 0 auto;
   width: 880px;
}

div#main-menu div.logo {
   float: left;
   margin: 43px 0 0 0;
}

div#main-menu div.menu {
   float: right;
}

div#main-menu div.menu ul li {
   float: left;
   margin: 0 0 0 22px;
}

div#main-menu div.menu ul li a {
   display: block;
   height: 70px;
   padding: 60px 0 0 0;
   font-size: 1.2em;
}

div#main-menu div.menu ul li a:hover {
   background: url(../images/assets/main-menu-selected-background.png) no-repeat center top;
   color: #000000;
}

div#main-menu.red-strip div.menu ul li a {
   display: block;
   height: 105px;
   padding: 60px 0 0 0;
   font-size: 1.2em;
}

div#main-menu.red-strip div.menu ul li a.selected,
div#main-menu.red-strip div.menu ul li a:hover {
   background: url(../images/assets/main-menu-selected-background.png) no-repeat center top;
   color: #000000;
}

div#main-menu div.sub-menu {
   position: absolute;
   top: 88px;
   right: 0;
   z-index: 5;
}

div#main-menu div.sub-menu ul li {
   float: left;
   margin: 0 0 0 22px;
}

div#main-menu div.sub-menu ul li a {
   font-size: 0.85em;
   color: #000000;
}

div#main-menu div.sub-menu ul li a.selected,
div#main-menu div.sub-menu ul li a:hover {
   text-decoration: underline;
}

div#flash-banner {
   width: 920px;
   height: 270px;
   background: #000000;
   margin: 0 auto 0 auto;
}

div#feature-case-study {
   margin: 5px 0 0 0;
   padding: 30px 0 0 0;
   width: 100%;
   height: 120px;
   background: #FFFFFF;
}

div#feature-case-study h2 {
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #FF3300;
}

div#feature-case-study div.container-centered {
   margin: 0 auto 0 auto;
   width: 880px;
}

div#feature-case-study div.title {
   float: left;
   width: 250px;
}

div#feature-case-study div.title a {
   display: block;
   margin: 60px 0 0 0;
   font-size: 0.7em;
   font-weight: bold;
   text-transform: uppercase;
   color: #000000;
}

div#feature-case-study div.case-study {
   float: right;
   padding: 10px 0 0 0;
   width: 570px;
}

div#feature-case-study div.case-study p {
   font-size: 0.8em;
   font-style: italic;
   line-height: 1.3em;
   color: #666666;
}

div#feature-case-study div.case-study span.position {
   display: block;
   margin: 22px 0 0 0;
}

div#content {
   clear: both;
   padding: 12px 0 0 0;
   width: 100%;
   background:  url(../images/assets/content-background-tile.jpg) repeat-x left top;
}

div#content div.container-centered {
   width: 924px;
   margin: 0 auto 0 auto;
}

div#what-we-offer {
   margin: 40px 0 40px 0;
}

div#what-we-offer h2.intro {
   clear: both;
   margin: 0 0 20px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.5em;
   font-weight: normal;
   text-indent: 20px;
}

div#pods {
   margin: 10px 0 0 0;
}

div.pod {
   float: left;
   width: 300px;
   height: 200px;
   background: #FFFFFF;
}

div.pod h2 {
   margin: 0 0 15px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #FF3300;
}

div.pod.margin-right {
   margin-right: 10px;
}

div.pod div.pod-content {
   padding: 25px 22px 22px 22px;
   width: 256px;
   height: 113px;
}

div.pod div.pod-content p {
   font-size: 0.75em;
   line-height: 1.3em;
   color: #666666;
}

div.pod div.pod-link {

}

div.pod div.pod-link a {
   display: block;
   padding: 12px 0 0 20px;
   width: 300px;
   height: 40px;
   font-size: 0.85em;
   font-weight: bold;
   text-transform: uppercase;
   background: url(../images/assets/pod-link-background.png) no-repeat left top;
   color: #FFFFFF;
}

div.pod div.pod-link a:hover {
   background: url(../images/assets/pod-link-selected-background.png) no-repeat left top;
}

div#main-content {
   margin: 20px 0 0 0;
   width: 924px;
   border-top: 1px solid #d7d7d7;
   background: #FFFFFF url(../images/assets/main-content-background-tile.jpg) repeat-y left top;
}

div#main-content.margin-bottom {
   margin-bottom: 40px;
}

div#main-content div.content {
   padding: 30px 20px 0 20px;
   width: 882px;
}

div#main-content div.content-corner {
   width: 924px;
   height: 29px;
   background: url(../images/assets/main-content-corner-background.jpg) no-repeat left top;
}

div#main-content h2 {
   margin: 0 0 30px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #FF3300;
}

div#main-content h3 {
   margin: -25px 0 30px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #000000;
}

div#main-content h4 {
   margin: 0 0 10px 0;
   font-size: 0.85em;
   font-weight: bold;
   color: #666666;
}

div#main-content p {
   margin: 0 0 20px 0;
   font-size: 0.85em;
   line-height: 1.3em;
   color: #666666;
}

div#main-content ul {
   margin: 0 0 20px 15px;
   list-style-type: disc;
   font-size: 0.85em;
   line-height: 1.3em;
}

div#main-content ul li {
   margin: 0 0 10px 0;
}

div#main-content p.intro {
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.2em;
   color: #000000;
}

div#main-content p.intro.margin-top {
   margin-top: 40px;
}

div#feature-content {
   float: left;
   margin: 20px 0 40px 0;
   padding: 30px 20px 20px 20px;
   width: 580px;
   height: 330px;
   background: #FFFFFF;
}

div#feature-content h2 {
   margin: 0 0 30px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #FF3300;
}

div#feature-content p {
   margin: 0 0 20px 0;
   font-size: 0.85em;
   line-height: 1.3em;
   color: #666666;
}

div#feature-content p.intro {
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.2em;
   color: #000000;
}

div#get-in-touch {
   float: left;
   margin: 20px 0 40px 0;
   padding: 30px 20px 20px 20px;
   width: 260px;
   height: 330px;
   background: #FF3300 url(../images/assets/get-in-touch-corner-background.png) no-repeat right bottom;
}

div#get-in-touch h2 {
   margin: 0 0 30px 0;
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.7em;
   font-weight: normal;
   color: #000000;
}

div#get-in-touch p {
   margin: 0 0 20px 0;
   font-size: 0.85em;
   font-weight: bold;
   line-height: 1.3em;
   color: #FFFFFF;
}

div#get-in-touch p.intro {
   font-family: Georgia, Helvetica, sans-serif;
   font-size: 1.2em;
   font-weight: normal;
}

div#get-in-touch a {
   color: #000000;
}

div.contact {
   float: left;
   width: 440px;
}

div#google-map {
   float: left;
   width: 425px;
   height: 375px;
   background:#000;
}

div#footer {
   clear: both;
   padding: 20px 0 0 0;
   width: 100%;
   min-height: 80px;
   background:  #FFFFFF url(../images/assets/footer-background-tile.jpg) repeat-x left top;
   border-bottom: 1px solid #E6E6E6;
}

div#footer div.container-centered {
   margin: 0 auto 0 auto;
   width: 876px;
}

div#footer div.copyright {
   float: left;
}

div#footer div.copyright p {
   font-size: 0.7em;
   font-weight: bold;
   color: #FF3300;
}

div#footer div.grain {
   float: right;
   text-transform: uppercase;
}

div#footer div.grain a {
   font-size: 0.7em;
   font-weight: bold;
   text-transform: uppercase;
   color: #999999;
}

/***********************************************
*
* General Style Classes
*
***********************************************/

.float-left {
   float: left;
}

.float-right {
   float: right;
}

.clear-both {
   clear: both;
}

.bold {
   font-weight: bold;
}

.italic {
   font-style: italic;
}

.red {
   color: #FF3300;
}