/*--ALLEN AGENCY STYLESHEET--
-----------------------------------*/
/*--GENERAL STYLES--
--------------------*/
a {margin: 0; padding: 0; text-decoration: none; color: #454c81;}
a:hover {text-decoration: underline;}
body {font-size: small; font-family: Arial, Helvetica, sans-serif; color: #707071;}
img {margin: 0; padding: 0; border: none;}
input {margin: 0; padding: 0;}
p {margin: 10px 0;}
select {height: 20px; margin: 0 0 4px 0; padding: 0; font-size: 10px; color: #454c81; font-weight: bold;}
table {margin: 0; padding: 0;}
td {vertical-align: top;}

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }/* required comment for clearfix to work in Opera \*/
* html .clearfix { height:1%; }
.clearfix { display:block; }/* end clearfix */

#content-wrapper {background: #ecf1fe url(/layout/images/content-wrapper-compass.jpg) no-repeat top right; border-top: 1px solid #6e80b7;}
#wrapper {
  width: 990px;
  margin: 0 auto;
  padding: 0;
  background-color: #ECF1FE;
}
/*--FONT STYLES--
-------------------------*/
h1, h2, h3, h4, h5, h6 {margin: 10px 0;}
h1 { font-size: 150%; color: #454C81}
h2 {font-size: 110%; color: #944237;}
h3 { color: #454c81; font-size: 110%;}

body#index h1 {font-size: 100%; color: #454c81; margin: 0}

#bottom-bar h2 {margin: 0 0 5px 0; text-transform: uppercase; font-size: 90%}
/*--HEADER STYLES--
--------------------*/
#header {padding: 0 30px 0 0; background-color: #FFFFFF;}
#logo {float: left;}
#utility-nav {margin: 10px 0; padding: 0; float: right;}
#utility-nav li {display: inline;}
#utility-nav a {display: inline; font-size: 90%; color: #565c8c; padding: 0 10px 0 5px; background: url(/layout/images/utility-nav-pipe.gif) no-repeat right center;}
#utility-nav a.last {background: none; padding-right: 0;}
/*--MAIN NAVIGATION STYLES--
--------------------*/
#main-nav {float: right; margin: 0; padding: 0;}

#main-nav li {
  display: block;
  float: left;
  list-style: none;
  width: 113px;
  height: 133px;
  margin-right: 2px;
}

#main-nav a {
  display: block;
  height: 133px;
  color: #FFFFFF;
  text-align: center;
  font-weight: bold;
}
#main-nav a span { display: block; padding-top: 70px;}
#main-nav li#nav-personal a {background: url(/layout/images/main-nav-personal.gif) no-repeat 0 0}
#main-nav li#nav-business a {background: url(/layout/images/main-nav-business.gif) no-repeat 0 0}
#main-nav li#nav-marine a {background: url(/layout/images/main-nav-marine.gif) no-repeat 0 0}
#main-nav li#nav-employee a{background: url(/layout/images/main-nav-employee.gif) no-repeat 0 0}
#main-nav li#nav-voluntary a {background: url(/layout/images/main-nav-voluntary.gif) no-repeat 0 0}
#main-nav li#nav-financial a {background: url(/layout/images/main-nav-financial.gif) no-repeat 0 0}

#main-nav li ul {
  position: absolute;
  left: -9999px;
  float: none;
  width: auto;
  padding: 0 5px 20px 10px;
  margin: 0;
  z-index: 5;
  min-width: 93px;
}

#main-nav li#nav-personal ul {background-color: #938210;}
#main-nav li#nav-business ul {background-color: #40804c;}
#main-nav li#nav-marine ul {background-color: #3f6a80;}
#main-nav li#nav-employee ul {background-color: #8e3f35;}
#main-nav li#nav-voluntary ul {background-color: #9a7b55;}
#main-nav li#nav-financial ul {background-color: #4b7b6b;}

#main-nav li:hover ul, #main-nav li.sfhover ul {left: auto; background-position: 0 0;}

#main-nav li ul li {
  float: none;
  width: auto;
  padding: 0;
  margin: 5px 0;
  height: auto;
  font-size: 100%;
  line-height: 17px;
  white-space: nowrap; /*--Keeps IE7 from splitting the links on hover--*/
}

#main-nav li ul li a {
  margin: 0;
  padding: 0;
  color: #FFFFFF;
  display: block;
  height: auto;
  text-align: left;
}
#header #main-nav li ul li a {
  background: none;
  margin: 0;
  padding: 0;
  display: block;
}

#main-nav li ul li ul {
  margin: 0;
  padding: 0 0 0 5px;
  width: auto;
  position: static;
}

#main-nav li ul li ul li a {
  font-size: 85%;
  margin: 0;
  padding: 0;
}
/*--SIDE NAVIGATION STYLES--
--------------------*/
#side-nav {margin: 0; padding: 0;}
#side-nav li {list-style: none; line-height: 15px; margin-bottom: 3px;}
#side-nav a {font-size: 85%; display: block;}
#side-nav a:hover {}
#side-nav a.side-nav-margin {margin-bottom: 20px;}
/*--FOOTER STYLES--
--------------------*/
#footer {
  width: 942px;
  margin: 0;
  padding-bottom:34px;
}

#footer-bottom {
  margin: 0;
  font-size: 85%;
  padding: 25px 0 50px 0;
  text-align: center;
  clear: both;
}
/*--INDEX SPECIFIC STYLES--
--------------------*/
body#index #content-wrapper-inner {background-image: none;}
body#index #content-left-wrapper {
  height: 371px;
  width: 521px;
  background-color: #FFFFFF;
  float: left;
}

body#index #content-left-wrapper .photo-caption {
  font-size: 85%;
  font-style: italic;
  position: relative;
  top: 15px;
  left: 30px;
}

body#index #content-right-wrapper {
  width: 414px;
  float: right;
  padding-right: 34px;
  padding-top: 20px;
  font-size: 90%;
}

body#index #content-right-wrapper #right-top {height: 95px;}
#content-right-wrapper #right-lower ul {margin: 0; padding: 0;}
#content-right-wrapper #right-lower li {margin: 0; padding: 0; list-style: none;}
#content-right-wrapper #right-lower a {font-weight: bold; padding-left: 8px; background: url(/layout/images/purple-bullet.png) no-repeat left center;}
body#index #lower-left, body#index #lower-right {
  background: url(/layout/images/index-white-block.gif) no-repeat 0 0;
  width: 180px;
  height: 231px;
  padding: 10px;
  float: left;
  margin-right: 10px;
}
body#index #lower-right {float: right; margin-right: 0;}


#bottom-bar-wrapper {background-color: #dbe0f1; clear: both; margin: 0 0 0 12px; padding-bottom: 23px; width: 944px; position: relative; top: 23px;}
#bottom-bar {
  width: 907px;
  background: url(/layout/images/footer-inner-bg.gif) repeat-y 0 0;
  position: relative;
  top: 17px;
  left: 23px;
}

#bottom-bar #left-column {
  width: 336px;
  height: 120px;
  margin: 0 1px 0 0;
  padding: 0 15px 0 0;
  float: left;
}

#bottom-bar #left-column ul {margin: 0; padding: 0;}
#bottom-bar #left-column li {list-style: none; font-size: 85%; color: #454c81; margin: 4px 0; border-top: 1px solid #454c81;}
#bottom-bar #left-column a {color: #454c81; font-weight: bold;}
#bottom-bar #middle-column {
  width: 319px;
  height: 120px;
  float: left;
  margin: 0 1px 0 0;
  padding: 0 0 0 17px;
  font-size: 85%;
  line-height: 190%;
}
#bottom-bar #middle-column h2 {font-size: 110%;}
#bottom-bar #middle-column a {color: #88222b; font-weight: bold; text-decoration: underline; margin-right: 5px;}
#bottom-bar #middle-column p {display: inline; color: #454c81;}
#bottom-bar #right-column {
  width: 190px;
  float: left;
  margin: 0;
  padding: 0 10px 0 17px;
}

#bottom-bar #right-column form {margin: 0; padding: 0;}
.bottom-select { width: 190px; height: 20px;}

/*--LEVEL 1 SPECIFIC STYLES--
--------------------*/
body#personal #td-h1 h1 {color: #938210;}  /*values not from psd, but those provided in the instructions*/
body#personal #page-banner {background-color:#938210;}
body#personal #bottom-content h3 {color:#938210;}

body#business #td-h1 h1 {color: #40804c;}
body#business #page-banner {background-color:#40804c}
body#business #bottom-content h3 {color:#40804c;} 

body#marine #td-h1 h1 {color: #3f6a80;}
body#marine #page-banner {background-color:#3f6a80}
body#marine  #bottom-content h3 {color:#3f6a80;}

body#employee #td-h1 h1 {color: #8e3f35;}
body#employee #page-banner {background-color:#8e3f35}
body#employee  #bottom-content h3 {color:#8e3f35;}

body#voluntary #td-h1 h1 {color: #9a7b55;}
body#voluntary #page-banner {background-color:#9a7b55}
body#voluntary  #bottom-content h3 {color:#9a7b55;}



body.level-1 #content-wrapper {background: url(/layout/images/level-1-large-compass.jpg) no-repeat top right;}
body.level-1 #content-wrapper-inner {background: none;}
body.level-1 #content-left {float: left; width: 664px;}
#td-h1 {vertical-align: middle; padding: 0 30px 0 15px;}
#td-h1 h1 {font-size: 190%; font-style: italic; font-weight: normal;}
#page-banner {height: 31px; width: 664px; margin-bottom: 7px;}
#page-banner h2 {
  display: inline;
  margin: 0;
  font-size: 15px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin-left: 45px;
  padding: 3px 25px 3px 0;
  position: relative;
  top: 5px;
  background: url(/layout/images/banner-compass.png) no-repeat right center;
}

body.level-1 #bottom-content {float: right;}
body.level-1 #bottom-left, body.level-1 #bottom-middle, body.level-1 #bottom-right {
  width: 200px;
  padding: 0;
  float: left;
  margin-right: 15px;
  font-size: 90%;
  background: #FFFFFF url(/layout/images/level-1-box-bottom.jpg) no-repeat bottom left;
}
body.level-1 #bottom-content .bottom-box-top {padding: 10px 13px 15px 13px; background: url(/layout/images/level-1-box-top.jpg) no-repeat 0 0;}
body.level-1 #bottom-right {margin-right: 0;}
body.level-1 #bottom-content h3 {color: #cfb715; margin-top: 0;}
body.level-1 #bottom-content ul {margin: 0; padding: 0;}
body.level-1 #bottom-content li {list-style: none;  padding: 0 0 0 10px; background: url(/layout/images/purple-bullet.png) no-repeat 0 5px;}
body.level-1 #bottom-content li {font-weight: bold;}

body.level-1 #content-right {float: right; width: 280px; margin-top: 148px; padding: 0 24px 0 0;}
body.level-1 #content-right #right-top {padding-bottom: 10px; border-bottom: 1px solid #6377b1;}
body.level-1 #content-right #right-bottom {color: #7183b9; padding-bottom: 10px; border-bottom: 1px solid #6377b1;}
/*--LEVEL 2 SPECIFIC STYLES--
--------------------*/
body.level-2-personal h1 {color: #938210;}
body.level-2-business h1 {color: #40804c;}
body.level-2-marine h1 {color: #3f6a80;}
body.level-2-employee h1 {color: #8e3f35;}
body.level-2-voluntary h1 {color: #9a7b55;}

#content-wrapper-inner {background: url(/layout/images/content-wrapper-bg.gif) repeat-y 0 0;}
#level-2-content-left {
  float: left;
  width: 200px;
  padding: 25px 20px 20px 30px;
  margin-right: 1px;
  background: url(/layout/images/level-2-top-white-gradient.jpg) repeat-x 0 0;
}

#level-2-content-left .side-nav-select {width: 190px;}

#level-2-content-middle {
  float: left;
  width: 419px;
  margin-right: 1px;
  padding: 25px 25px 0 25px;
}

#level-2-content-middle h1 {font-size: 180%; font-weight: normal;}
#level-2-content-middle #intro-block {padding-bottom: 10px; border-bottom: 1px solid #454c81;}

#level-2-content-right {
  float: left;
  width: 219px;
  background: url(/layout/images/level-2-top-white-gradient.jpg) repeat-x 0 0;
  padding: 25px 25px 0 25px;
}
#level-2-content-right #bulletin-board-link {font-weight: bold; text-decoration: underline; color: #525989; font-size: 90%;}
#level-2-content-right #right-select-nav {margin-top: 30px;}
#level-2-content-right #right-select-nav .right-nav-select {width: 190px; margin-bottom: 4px;}
#level-2-content-right ul {margin: 0; padding: 0;}
#level-2-content-right li {list-style: none; font-size: 85%;}