@charset "utf-8";
/* CSS Document BC4B*/
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800);

html.authed body { padding-top: 100px; }

body, html { background-color: #fff; margin: 0; padding: 0; border-top: solid 10px #003A63; background-image: url('../images/world-map.jpg'); background-repeat: no-repeat; background-position: center top;}
body { font-size: 14px; font-family:'Open Sans', Arial, Helvetica, Sans-Serif; color: #666; padding: 0; margin: 0; }

h1 { font-size: 30px; text-transform: capitalize; font-weight: 400; font-style: italic; border-bottom: solid 2px #C8CED3; padding: 3px 0; margin: 0; }
h2 { font-size: 16px; font-weight: 600; text-transform: uppercase;}
h3 { font-size: 16px; font-weight: 600; font-style: italic; text-transform: uppercase;}
p { color: #666; font-weight: 300; line-height: 20px;}
a img { border: none; }
a, a:link, a:visited { color: #8FACBE;}
a:hover { color: #003A63; }
li { font-weight: 300; padding: 0; margin: 0;}
ul { margin: 0; padding: 0 0 0 25px;}


#outer { width: 1000px; margin: 0; padding: 0;}


/* Header */
#header-outer { width: 100% margin: auto; padding: 0; border-bottom: solid 1px #ccc;}
#header { height: 200px; margin: 0 auto; padding: 0;width: 1000px; border-left: solid 1px #ccc; border-right: solid 1px #ccc;}
#logo { float: left; width: 230px; height: 160px; padding: 20px;}

#menu { width: 700px; height: 40px; float: right; margin-top: 140px; }
ul#main { padding: 0; margin: 0; height: 40px;}
ul#main li { list-style: none; float: left; padding-left: 40px;}
ul#main li a { display: block; text-decoration: none; text-transform: uppercase; line-height: 40px;text-align: right; color: #666; font-size: 13px; font-family: 'Avenir 65 Medium', sans-serif; }
ul#main li a:hover, ul#main li.sel a {color: #003A63; border-top: solid 4px #003A63; margin-top: -4px;}

#content { border-left: solid 1px #ccc; border-right: solid 1px #ccc; padding: 20px 20px 40px 20px; width: 960px; margin: 0 auto;} 

#home-banner { width: 960px; height: 250px; border-bottom: solid 1px #ccc; padding: 20px 0 40px 0;}

#home-slider {width: 960px; height: 250px;  position: relative; overflow: hidden; z-index: 5; padding: 0; margin: 0;}
#home-slider .item { position: absolute; left: 0; bottom: 0; }
/* end home slider */

/* Footer */
#footer-outer{ width: 100%; background-color: #003A63;}
#footer-inner { width: 960px; margin: auto; padding: 10px 0;}
#footer-left { float: left; width: 460px;}
#footer-right { float: right; width: 460px;}


#footer-left.footer-left p { color: #fff; font-size: 15px; font-weight: 400; font-style: italic; line-height: 18px;}
#footer-left.footer-left a { color: #fff; font-style: italic; font-weight: 400; font-size: 14px; text-decoration: none;}
#footer-left.footer-left a:hover { color: #ccc;}

#footer-right.footer-right p { color: #fff; font-size: 15px; font-weight: 400; font-style: italic; line-height: 18px;}
#footer-right.footer-right a { color: #fff; font-style: italic; font-weight: 400; font-size: 15px; text-decoration: none;}
#footer-right.footer-right a:hover { color: #ccc;}
/* Modules */
.form { }
.form .field { clear: left; padding-top: 10px; }
.form .field .title { float: left; width: 80px; line-height: 22px; padding: 2px 0; }
.form .field .input { float: left; padding-left: 90px; }
.form .field .input input { border: solid 1px #444; background-color: #fff; color: #333; padding: 2px 4px; width: 200px; height: 22px; line-height: 18px; }
.form .field .input textarea { border: solid 1px #444; background-color: #fff; color: #333; padding: 2px 4px; width: 200px; height: 54px; line-height: 18px; }
.form .submit { clear: left; width: 380px; padding-top: 10px; text-align: right; }

/*COLUMN LAYOUT*/
.layout-columns { width: 960px; padding: 0; }
/*.layout-columns .grid-col .content-viewer { padding: 20px;}*/

.grid-col { float: left; display: inline; }

/* 1000 wide */
.layout-columns .col_1 { width: 960px;}

.layout-columns .col_1_2 { width: 960px;}
.layout-columns .col_1_2.alpha { width: 460px; margin-right: 20px; }
.layout-columns .col_1_2.omega { width: 460px;  margin-left: 20px;}

.layout-columns .col_1_3 { width: 350px;}
.layout-columns .col_1_3.alpha { width: 350px; margin-right: 20px;}
.layout-columns .col_2_3.omega { width: 570px; margin-left: 20px;}

.layout-columns .col_1_4 { width: 230px; margin-right: 26px;}
.layout-columns .col_1_4.alpha { width: 230px; }
.layout-columns .col_1_4.omega { width: 230px; margin: 0;}
.layout-columns .col_1_4 .content-viewer { width: 230px;}


/* #Clearing
================================================== */
/* Self Clearing Goodness */
.container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }

.row:after,
.clearfix:after {
  clear: both; }

.row,
.clearfix {
  zoom: 1; }

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }
