/*  HTML5 - Boilerplate  */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
ins { background-color: #ff9; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
table { border-collapse: collapse; border-spacing: 0; }
tr { vertical-align: top;  }
td { padding: 3px; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 2em 0; padding: 0; }
input, select { vertical-align: middle; }
textarea { vertical-align: top; }

body { font: 300 14px/1.231 "Roboto", Arial, Helvetica, sans-serif; *font-size: small; } 
select, input, textarea, button { font: 99% "Roboto", Arial, Helvetica, sans-serif; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

html { overflow-y: scroll; }
a:hover, a:active { outline: none; }
ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }
nav ul, nav li { margin: 0; list-style: none; list-style-image: none; }
small { font-size: 85%; }
strong { font-weight: 900; }
th { font-weight: bold; }
em { font-style: italic; }
td { vertical-align: top; }

sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; } 
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid { box-shadow: 0 0 5px red; }
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }

::-moz-selection { background: #e8f7f8; color: #000; text-shadow: none; }
::selection { background: #e8f7f8; color: #000; text-shadow: none; }
a:link { -webkit-tap-highlight-color: #e8f7f8; }

button { width: auto; overflow: visible; }
.ie7 img { -ms-interpolation-mode: bicubic; }

body, select, input, textarea { color: #444; }
h1, h2, h3, h4, h5, h6 { font-weight: bold; }


/* Tom Moore styles */

body           { background: #9fd3dc url('images/logo-c.png') left top repeat; color: #000; }

h1             { font-weight: bold; font-size: 2.2em; margin: 1em 0 0.5em; text-align: center; clear: both; }
h2             { font-weight: 900; font-size: 1.4em; margin: 1em 0 0.5em; }
h3             { font-weight: bold; font-size: 1.1em; padding: 0.2em 0; margin: 0 0 0.3em 0; }
ul,ol          { margin: 1em 0 1em 2.5em; line-height: 1.6; }
ul.plain        { list-style: none; margin-left: 0; }
li             { margin: 1em 0; }
p              { margin: 1em 0; line-height: 1.6; }
em             { font-style: italic; }
label          { font-weight: bold; }
a              { color: #3997a5; font-style: normal; font-weight: 700; text-decoration: none; }
a:hover         { color: #aaa; }
a img          { border: none; }
table          { margin: 1em auto; border-collapse: collapse; }
tr             { vertical-align: top; }
td, th         { padding: 0.2em; }
form           { margin: 0.5em auto; }
fieldset       { margin: 1em; padding: 1em; border-radius: 10px; background: #f8f8f8; border: none;
                   text-align: left; }
legend         { margin: 0; padding: 0.3em 0.5em 0.2em; font-weight: bold; font-size: 1.2em;
                   background-color: rgba(212,212,212,0.4); border-top-left-radius: 8px; border-top-right-radius: 8px; }
legend + fieldset   { margin-top: 0; }
label              { font-weight: bold; display: block; margin: 0.6em 0; }
label.inline        { display: block; float: left; clear: left; text-align: right; padding-right: 1em; width: 25%; }
label.inline2       { display: inline; padding-right: 1em; padding-left: 1em; }
textarea           { font-family: 'Roboto', Arial, Helvetica, sans-serif; font-size: 1em; font-weight: normal;
                        border: 1px solid #ddd; background: #fdfdfd;
                        margin: 0.3em 0; padding: 0.3em; }
select             { font-family: 'Roboto', Arial, Helvetica, sans-serif; font-size: 1em; font-weight: normal;
                        border: 1px solid #ddd; background: #fdfdfd;
                        margin: 0.3em 0; }
input              { font-weight: normal; margin: 0.3em 0; padding: 0.3em; border: 1px solid #ddd; background: #fdfdfd; }
input[type="button"],
input[type="submit"],
a.btn,
button             { position: relative; display: inline-block; margin: 0.3em 0; padding: 0 1em;
                        font-family: 'Roboto', Arial, Helvetica, sans-serif; font-size: 0.9em; font-weight: 900;
                        text-decoration: none; text-transform: uppercase; line-height: 2;
                        border: none; border-radius: 8px; background-color: #68bccc; color: #fff; }
input[type="button"]:hover,
input[type="submit"]:hover,
a.btn:hover,
button:hover        { background-color: #fd0; color: #000; box-shadow: 0 0 12px #999; }
button:active, a.btn:active,
input[type="submit"]:active { top: 1px; left: 1px; color: #000; box-shadow: 0 0 15px #bbb; }

textarea:focus,
select:focus,
input:focus           { background: #fff; }
input[type="image"],
input[type="checkbox"],
input[type="radio"]    { border: none; }
.inputgrp           { width: 65%; margin: 0.3em 0; float: left; }
.form-btns          { margin: 1em auto; text-align: center; }

header         { position: relative; z-index: 3; margin-top: 50px;
                   background: rgba(57,151,165,0.8); box-shadow: 0 0 3em #2787a0; }
nav            { position: relative; z-index: 2; width: 100%; height: 3em; margin: 0 auto;
                   display: table; font-size: 0.9em; text-transform: uppercase; text-align: right; }
nav #phone      { padding-left: 184px; color: #fff; display: table-cell; vertical-align: middle;
                   font-size: 1.8em; font-weight: 900; text-shadow: 0 0 15px #68bccc; text-align: left; }
nav a          { font-weight: 900; color: #fff; }
nav a:hover     { font-weight: 900; color: #fcec92; }
nav ul         { list-style: none; display: table-cell; vertical-align: middle; padding-right: 1em; }
nav li         { display: inline; padding: 0 .5em; }
nav li.active   { background-color: #fd0; }
nav li.active a { color: #000; }
#logo          { position: absolute; left: -10px; top: -60px; z-index: 5; height: 204px; width: 204px;
                   background: url('images/logo.png') left top no-repeat; }
.page          { margin: -4em auto 1em auto; padding-top: 5em; width: 100%; min-width: 240px; min-height: 500px;
                  color: #000; background-color: #fff; box-shadow: 0 0 7em #fff;
                  border-top: 0.4em solid #000; border-bottom: 0.4em solid #68bccc; }
footer        { color: #000; text-align: center; font-size: 0.85em; clear: both; margin: 1em auto; }
footer div    { padding: 0.5em 1em; }
footer a      { color: #2787a0; font-style: normal; font-weight: normal; text-decoration: none; }
footer a:hover { color: #fff; font-weight: normal; }
section section h1 { text-align: left; font-size: 1.2em; }
aside         { float: left; width: 30%; position: relative; margin: 0 2% 1em 0; padding: 2%;
                  background-color: #68bccc; color: #fff; }
aside h1      { font-size: 1.2em; margin: 0 auto; }
aside li      { margin: 0; }
aside.c       { float: none; display: inline-block; margin: 0 auto 1em auto; }
aside.l       { float: left; margin: 0 2% 1em 0; }
aside.r       { float: right; margin: 0 0 1em 2%; }
aside.photo    { background-color: #eee; padding: 1%; color: #222; font-style: italic; }
.photo img     { max-width: 100%; max-height: 100%; vertical-align: top; }

.bxslider          { margin: 0; list-style: none; }
.bxslider img      { width: 100%; }
.bx-viewport       { box-shadow: none !important; }
.bx-wrapper        { width: 90%; max-width: 800px; margin-left: auto !important; margin-right: auto !important; }
.bx-wrapper ul     { margin: 0; }
.bx-wrapper li img { width: auto; max-width: 100%; max-height: 600px; margin-left: auto; margin-right: auto; }
#bx-pager          { margin: 0 auto; text-align: center; }
#bx-pager .pager-images { height: 100px; width: 100px; margin: 0 0.5em 0.5em 0; display: inline-block;
                          background-color: #eee; padding: 1%; }
#bx-pager .pager-images img { max-width: 100%; max-height: 100%; vertical-align: top; }

#testimonials       { margin: 1em 0 0.5em; padding: 1em; position: relative; overflow: hidden; clear: both;
                       background-color: #eee; }
#testimonials ul    { margin: 0; min-height: 3em; list-style: none; }
#testimonials li    { width: 100%; font-style: italic; }
#testimonials h1    { margin-top: 0; }
#testimonials > li ~ li { display: none; }
.cust          { font-style: normal; font-weight: 700; }
#logos         { text-align: center; margin: 2em 0 1em 0; height: 96px; }
#logos img     { margin: 0 0.3em; height: 100%; }

.phhdr         { height: 400px; width: 100%; margin-top: -5em;
                  border-bottom: 0.4em solid #000;
                  overflow-y: hidden; text-align: center; position: relative; }
.phhdr img     { width: 100%; vertical-align: top; }
.phhdr > img ~ img { display: none; position: absolute; left: 0; top: 0; }

.notice        { width: 100%; text-align: center; padding: 0.2em 1em; background-color: rgba(255,255,255,0.6); }
.notice p      { margin: 0.3em auto; font-size: 0.9em; }
.padbox        { padding: 1em 4em; position: relative; }
.phhdr + .padbox { border-top: 0.4em solid #68bccc; }

.general-list       { list-style: none; margin: 10px 0; }
.general-list li    { position: relative; padding: 5px 10px; border: 1px solid #ddd; border-radius: 8px;
                       background-color: #fdfdfd; }
.general-list li li { padding: 0; border: none; }
.general-list h2    { margin: 0; }
.general-list p     { margin: 0; }
.general-list .photo { position: absolute; top: 5px; left: 8px; width: 64px; height: 64px; }
.general-list .photo img { width: 100%; }
.selectable-list li { cursor: pointer; padding-right: 40px; }
.selectable-list li:hover { box-shadow: 0 0 12px #bbb; }
.reorderable-list li.inactive { opacity: 0.5; }
.image-list      { width: 100% !important; }
.image-list li.pht { width: 100px; height: 100px; margin: 0 0.5em 0.5em 0; float: left;
                     text-align: center; }
.image-list .img { max-width: 100%; max-height: 80px; }
.image-list .actions { bottom: 8px; top: auto; }
.portfolio-list { list-style: none; margin: 1em 0; }
.portfolio-list li { padding: 1em 0 1em 220px; border-bottom: 1px dotted #ddd; }
.portfolio-list .photo { height: 200px; width: 200px; float: left; padding: 1%; margin-right: 2%;
                         margin-left: -220px; background-color: #eee; text-align: center; }


.actions    { position: absolute; top: 8px; right: 8px; }
.actions.sp { top: 12px; right: 12px; }
.actions ul { margin: 0; padding: 0; list-style: none; }
.actions li { margin: 0; padding: 0; float: left; }

.small         { font-size: 0.85em; }
.promo      { font-size: 1.25rem; font-style: italic; font-weight: bold; }

.events      { margin-left: 220px; text-align: left; }
.event       { padding: 10px; position: relative; }
.event h2    { margin: 0; }
.event p     { margin: 0.5em 0; }
.event ul,
.event ol    { margin-top: 0.5em; margin-bottom: 0.5em; }
.event .location { margin-top: 0; font-weight: 600; }
.event .date { font-weight: 600; margin: 0.5em 0 0; font-size: 0.9em; }
.even        { background-color: #f0f0f0; }

#options, #tracks { position: relative; width: 65%; float: left; }
#options > div   { position: relative; }
#options .actions { right: 0; }
#tracks .actions { top: 5px; }
#plusact     { margin: 0; }

.mceLayout   { width: 100% !important; }

.warn       { font-weight: 700; color: #bb0118; }
.inline     { display: inline; }
.dlg        { display: none; }
.disp-none   { display: none; }
.as { display: none; }
.posrel     { position: relative; }
.ofa        { overflow: auto; }
.fl         { float: left; }
.fr         { float: right; }
.cl         { clear: left; }
.cr         { clear: right; }
.cb         { clear: both; }
.l          { text-align: left; }
.r          { text-align: right; }
.c          { text-align: center; margin-left: auto; margin-right: auto; }
.j          { text-align: justify; }
.w2em       { width: 2em; }
.w3em       { width: 3em; }
.w3         { width: 3%; }
.w5         { width: 5%; }
.w8         { width: 8%; }
.w10        { width: 10%; }
.w15        { width: 15%; }
.w20        { width: 20%; }
.w25        { width: 25%; }
.w30        { width: 30%; }
.w35        { width: 35%; }
.w40        { width: 40%; }
.w50        { width: 50%; }
.w55        { width: 55%; }
.w65        { width: 65%; }
.w70        { width: 70%; }
.w75        { width: 75%; }
.w80        { width: 80%; }
.w90        { width: 90%; }
.w100       { width: 100%; }
.w32px      { width: 32px; }
.w64px      { width: 64px; }
.w100px     { width: 100px; }
.w160px     { width: 160px; }
.w360px     { width: 360px; }
.h32px      { height: 32px; }
.h64px      { height: 64px; }
.h100px     { height: 100px; }
.h160px     { height: 160px; }
.h360px     { height: 360px; }
.minh64px    { min-height: 64px; }
.lh32px     { line-height: 32px; vertical-align: middle; }
.mart       { margin-top: 2em; }
.marb       { margin-bottom: 2em; }
.marr       { margin-right: 1em; }
.mart10px   { margin-top: 10px; }
.padr64px    { padding-right: 64px !important; }
.padtb      { padding-top: 0.5em; padding-bottom: 0.5em; }
.red        { color: #c00; }
.small      { font-size: 0.9em; }
.tiny       { font-size: 0.8em; }
.nobck      { background: none; }
.brd        { border: 1px solid #ddd; }
.nobrd      { border: none; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

@media (min-width: 1000px) {
  nav, .page { width: 1000px; }
}

@media (max-width: 800px) {
  aside    { width: 35%; }
}

@media (max-width: 640px) {
  #logo     { background: url('images/logo-2.png') left top no-repeat; height: 160px; width: 160px; }
  #logos    { height: 72px; }
  nav #phone { padding-left: 140px; font-size: 1.4em; line-height: 2; }
  nav      { display: block; }
  nav ul   { display: block; width: 100%; padding: 0; margin-top: 4em; }
  nav li   { display: block; float: left; padding: 0.3em 0; margin: 0.5%; width: 49%;
              background-color: #eee; text-align: center; }
  nav li a { display: block; color: #000; }
  h1       { padding-top: 1em; }

  .padbox   { padding-left: 1em; padding-right: 1em; }
  aside    { float: none !important; width: 80%;
              margin: 0 auto 1em auto !important; }
  aside.photo { text-align: center; }
  aside.photo img { max-height: 400px; }
  .portfolio-list li { padding-left: 120px; }
  .portfolio-list h2 { margin-top: 0.2em; }
  .portfolio-list .photo { height: 100px; width: 100px; margin-left: -120px; }


  label    { margin: 0.3em 0 0; }
  label.inline { float: none; width: 80%; text-align: left; }
  form.w80  { width: 100%; }
  input.w20 { width: 40%; }
  input.w25 { width: 75%; }
  input.w30 { width: 50%; }
  .inputgrp,
  input.w65,
  textarea.w65 { width: 95%; }
}

@media (max-width: 480px) {
  #logos    { height: 60px; }
  .portfolio-list li { padding-left: 0; }
  .portfolio-list .photo { height: 200px; width: 200px; float: none; margin: 0 auto; }
  footer   { font-size: 0.7em; }
  select   { max-width: 200px; overflow: hidden; }
  option   { max-width: 200px; overflow: hidden; }
}

@media (max-width: 320px) {
  #logos    { height: 48px; overflow: hidden; }
  .phhdr    { height: auto; min-height: auto; }
  select   { max-width: 160px; overflow: hidden; }
  option   { max-width: 160px; overflow: hidden; }
}

@media (max-height: 800px) {
  .bx-wrapper li img { max-height: 460px; }
}
@media (max-height: 700px) {
  .bx-wrapper li img { max-height: 360px; }
}
@media (max-height: 600px) {
  .bx-wrapper li img { max-height: 260px; }
}