/******************************************************************
Site Name:
Author:

Stylesheet: Base Mobile Stylesheet

Be light and don't over style since everything here will be
loaded by mobile devices. You want to keep it as minimal as
possible. This is called at the top of the main stylsheet
and will be used across all viewports.

------------ MAP ------------

01. GENERAL STYLES
02. WORDPRESS BODY CLASSES
03. LAYOUT & GRID STYLES
04. LINK STYLES
05. H1, H2, H3, H4, H5 STYLES
06. HEADER STYLES
07. NAVIGATION STYLES
08. POSTS & CONTENT STYLES
09. PAGE NAVI STYLES
10. COMMENT STYLES
11. COMMENT FORM STYLES
12. SIDEBARS & ASIDES
13. FOOTER STYLES

******************************************************************/
/*********************
01. GENERAL STYLES
*********************/
html,
body {
  /* height: 100%; */
}
body {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: #565656;
  background: #ffffff;
}
/*********************
02. LAYOUT & GRID STYLES
*********************/
#main_wrapper div#background_wrapper {
  float: left;
  width: 100%;
  background: url(img/login-bg.png) top center no-repeat #147d89 !important;
  padding: 0 0 350px 0;
}
#main_wrapper div#background_wrapper div#header {
  background: #000;
  padding: 5px 0;
}
#main_wrapper div#background_wrapper div#title_box {
  display: none;
}
#main_wrapper div#background_wrapper div#navigation {
  display: none;
}
#main_wrapper div#background_wrapper #ContentPlaceHolderBody_lblMsg,
#main_wrapper div#background_wrapper #ctl00_ContentPlaceHolderBody_lblPwdResponse,
#main_wrapper div#background_wrapper #ContentPlaceHolderBody_LabelUpdateResults,
#main_wrapper div#background_wrapper #ContentPlaceHolderBody_CompareValidator1 {
  position: relative;
  color: #ff0000;
  font-size: 11px;
  padding: 20px 10px;
  width: auto;
  top: 20px;
}
#main_wrapper div#background_wrapper span#ContentPlaceHolderBody_vUserPass {
  position: relative;
  color: #ff0000;
  font-size: 11px;
  padding: 20px 10px;
  width: auto;
  top: 20px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 {
  margin: 0 auto;
  display: block;
  width: 320px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-logo {
  float: left;
  width: 100%;
  line-height: 0;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-logo img {
  width: 100%;
  max-width: 100%;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-characters {
  float: left;
  width: 100%;
  line-height: 0;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-characters img {
  width: 100%;
  max-width: 100%;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login {
  float: left;
  clear: both;
  width: 320px;
  background: #e2e1e1;
  padding: 20px 0;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div#info_bar_prog_home {
  float: left;
  width: 100%;
  padding: 10px 0;
  color: #0f7581;
  font-family: "Bree Serif", serif;
  text-align: center;
  font-size: 30px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login span.login-title {
  display: none;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item {
  float: left;
  width: 92%;
  margin-left: 4%;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item label#ContentPlaceHolderBody_Label_UserName {
  float: left;
  width: 100%;
  padding-top: 25px;
  font-size: 14px;
  color: #02393f;
  font-family: "Bree Serif", serif;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item label#ContentPlaceHolderBody_Label_Password {
  float: left;
  width: 100%;
  padding-top: 25px;
  font-size: 14px;
  color: #02393f;
  font-family: "Bree Serif", serif;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item input#ContentPlaceHolderBody_txtUserName {
  float: left;
  width: 100%;
  border: 0;
  background: #fff;
  padding: 10px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item input#ContentPlaceHolderBody_txtUserPass {
  float: left;
  width: 100%;
  border: 0;
  background: #fff;
  padding: 10px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-checkbox {
  float: left;
  width: 92%;
  margin-left: 2%;
  margin-top: 20px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-checkbox label#ContentPlaceHolderBody_Label_RememberMe {
  float: left;
  width: 100%;
  font-size: 14px;
  color: #02393f;
  font-family: "Bree Serif", serif;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login #login-buttons {
  float: left;
  width: 96%;
  margin: 2% 2% 5% 2%;
  text-align: center;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login #login-buttons a#ContentPlaceHolderBody_cmdLogin {
  width: auto;
  padding: 5px 20px 5px 20px;
  text-decoration: none;
  background: #f26c4f;
  font-size: 18px;
  font-family: "Bree Serif", serif;
  color: #ffffff;
  border: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login #login-buttons a#ContentPlaceHolderBody_cmdLogin:hover {
  background: #c64d32;
  background-position: right;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div.register {
  float: left;
  width: 100%;
  text-align: center;
  margin-bottom: 20px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div.register a {
  float: left;
  width: 90%;
  margin-left: 5%;
  text-align: center;
  clear: right;
  padding: 10px 40px 10px 40px;
  font-family: "Bree Serif", serif;
  color: #ffffff;
  background: #fdb414;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  margin-bottom: 10px;
  font-size: 14px;
  text-decoration: none;
  font-size: 18px;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div.register a:hover {
  background: #d3940a!important;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .account-links {
  float: left;
  width: 98%;
  margin-left: 2%;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 10px;
  padding: 10px 0;
  font-size: 14px;
  font-family: "Bree Serif", serif;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .account-links a#ContentPlaceHolderBody_pswdReminder {
  color: #02393f;
  text-decoration: none;
}
#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .account-links a#ContentPlaceHolderBody_pswdChange {
  color: #02393f;
  text-decoration: none;
}
.wrap {
  width: 100%;
  margin: 0 auto;
}
#container {
  margin: 0 auto;
  width: 100%;
  /* End Header */
  /* Table Style */
}
#container .banner {
  float: left;
  width: 100%;
  background: #ffffff;
  padding-bottom: 0px;
}
#container .banner div.wrap {
  margin: 0 auto;
}
#container .banner div.wrap .home {
  float: left;
  width: 100%;
  text-align: center;
  margin: 15px 0 0 0;
}
#container .banner div.wrap .navigation {
  float: right;
  width: 100%;
  padding: 0px 0;
  margin-right: 0px;
  margin-bottom: 0px;
}
#container .banner div.wrap .navigation ul {
  line-height: 0;
}
#container .banner div.wrap .navigation ul li {
  list-style: none;
  display: block;
}
#container .banner div.wrap .navigation ul li a {
  float: right;
  width: 100%;
  font-family: "Bree Serif", serif;
  color: #ffffff;
  margin-left: 15px;
  font-size: 16px;
  padding: 20px 10px;
  text-decoration: none;
  margin-bottom: 1px;
}
#container .banner div.wrap .navigation ul li a.logout {
  background: url(img/lock.png) no-repeat #000000;
  background-position: left;
  padding: 20px 15px 20px 35px;
}
#container .banner div.wrap .navigation ul li a.logout:hover {
  background: #080808;
}
#container .banner div.wrap .navigation ul li a.ebook {
  background: #00703c;
}
#container .banner div.wrap .navigation ul li a.ebook:hover {
  background: #006134;
}
#container .banner div.wrap .navigation ul li a.resources {
  background: #fdb414;
}
#container .banner div.wrap .navigation ul li a.resources:hover {
  background: #f5a902;
}
#container .banner div.wrap .navigation ul li a.make {
  background: #0f7581;
}
#container .banner div.wrap .navigation ul li a.make:hover {
  background: #0d6973;
}
#container .holder {
  margin: 0 auto;
}
#container .desktop {
  display: none;
}
#container .mobile {
  display: block;
}
#container .site-header {
  float: left;
  width: 100%;
  background: url(img/header-bg.png) no-repeat;
  -moz-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
  background-size: 100% 100%;
}
#container .site-header .wrap {
  margin: 0 auto;
  width: 320px;
}
#container .site-header .wrap .logo {
  float: left;
  width: 100%;
  text-align: center;
  margin: 10px 0;
}
#container .site-header .wrap .logo img {
  width: 100%;
  max-width: 100%;
}
#container .site-header .wrap .hex {
  float: right;
  width: 100%;
  text-align: center;
  margin: 0px 0;
}
#container .site-header .wrap .hex img {
  width: 100%;
  max-width: 100%;
}
#container div.content {
  float: left;
  width: 100%;
  background: #ffffff;
}
#container div.content div.wrap {
  margin: 0 auto;
  width: 96%;
  /* End Left Menu */
  /* End Inner Content */
}
#container div.content div.wrap div.left-menu {
  float: left;
  width: 100%;
  margin-top: 0px;
}
#container div.content div.wrap div.left-menu h1 {
  font-size: 18px;
  color: #d74139;
}
#container div.content div.wrap div.left-menu p {
  font-size: 13px;
  font-style: bold;
  color: #d74139;
}
#container div.content div.wrap div.left-menu .left-box {
  float: left;
  width: 100%;
  background: #ebebeb;
  padding: 20px 0px 50px 0px;
}
#container div.content div.wrap div.left-menu .left-box h3 {
  float: left;
  width: 100%;
  text-transform: uppercase;
  color: #ffffff;
  background: #006672;
  background-position: right;
  font-size: 18px;
  padding: 15px 30px 25px 30px;
}
#container div.content div.wrap div.left-menu .left-box select {
  float: left;
  width: 90%;
  margin-left: 5%;
  padding: 5px;
}
#container div.content div.wrap div.left-menu .left-box ul {
  float: left;
  width: 90%;
  margin: 0% 5% 3% 5%;
}
#container div.content div.wrap div.left-menu .left-box ul li {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.left-menu .left-box ul li a {
  float: left;
  width: 100%;
  padding: 15px 20px;
  color: #ffffff;
  text-decoration: none;
  font-size: 13px;
  font-family: "Bree Serif", serif;
  font-weight: 400;
}
#container div.content div.wrap div.left-menu .left-box ul li a.inactive {
  opacity: 0.4;
}
#container div.content div.wrap div.left-menu .left-box ul li a.home {
  background: url(img/home-icon.png) no-repeat #f48479;
  background-position: right;
}
#container div.content div.wrap div.left-menu .left-box ul li a.home:hover {
  background: url(img/home-icon.png) no-repeat #f15d4f;
  background-position: right;
}
#container div.content div.wrap div.left-menu .left-box ul li a.habitat {
  background: #0093a7;
}
#container div.content div.wrap div.left-menu .left-box ul li a.habitat:hover {
  background: #006b79;
}
#container div.content div.wrap div.left-menu .left-box ul li a.maps {
  background: #cb8f20;
}
#container div.content div.wrap div.left-menu .left-box ul li a.maps:hover {
  background: #a3731a;
}
#container div.content div.wrap div.left-menu .left-box ul li a.settlement {
  background: #006672;
}
#container div.content div.wrap div.left-menu .left-box ul li a.settlement:hover {
  background: #003d44;
}
#container div.content div.wrap div.left-menu .left-box ul li a.economic {
  background: #008d4c;
}
#container div.content div.wrap div.left-menu .left-box ul li a.economic:hover {
  background: #005f33;
}
#container div.content div.wrap div.left-menu .left-box ul li a.exam {
  background: #83708b;
}
#container div.content div.wrap div.left-menu .left-box ul li a.exam:hover {
  background: #6b5c72;
}
#container div.content div.wrap div.left-menu .left-box .box {
  float: left;
  width: 90%;
  margin: 5% 5% 3% 5%;
  background: #ffffff;
}
#container div.content div.wrap div.left-menu .left-box .box h4 {
  float: left;
  width: 100%;
  background: url(img/selct-bg.png) no-repeat #f48479;
  background-position: right;
  color: #ffffff;
  margin: 0;
  padding: 15px 20px;
  font-family: "Open Sans", sans-serif;
  font-size: 16px;
}
#container div.content div.wrap div.left-menu .left-box .box ul {
  list-style: none;
  margin: 10px 15px;
}
#container div.content div.wrap div.left-menu .left-box .box ul li {
  margin-bottom: 5px;
}
#container div.content div.wrap div.left-menu .left-box .box ul li a {
  color: #006672;
  background: #ffffff;
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  padding: 5px;
}
#container div.content div.wrap div.left-menu .left-box .box ul li a:hover {
  background: #ebebeb;
}
#container div.content div.wrap div.left-menu .left-box .box ul li a.selected {
  background: #ebebeb;
}
#container div.content div.wrap div.left-menu .left-box .resources {
  float: left;
  width: 90%;
  margin: 5% 5% 3% 5%;
}
#container div.content div.wrap div.left-menu .left-box .resources h4 {
  float: left;
  width: 100%;
  color: #0f7581;
  margin: 0;
  padding: 15px 20px 0px 20px;
  font-family: "Bree Serif", serif;
  font-size: 16px;
}
#container div.content div.wrap div.left-menu .left-box .resources ul {
  list-style: none;
  margin: 10px 20px;
}
#container div.content div.wrap div.left-menu .left-box .resources ul li {
  margin-bottom: 5px;
  background: #006672;
  margin: 0;
  padding: 10px;
}
#container div.content div.wrap div.left-menu .left-box .resources ul li i {
  float: left;
  width: 10%;
  color: #ffffff;
  font-size: 18px;
}
#container div.content div.wrap div.left-menu .left-box .resources ul li a {
  float: left;
  width: 90%;
  color: #ffffff;
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  padding: 0;
  background: url(img/icons/check-off.png) no-repeat;
  background-position: right;
}
#container div.content div.wrap div.left-menu .left-box .resources ul li a:hover {
  background: url(img/icons/check-on.png) no-repeat;
  background-position: right;
}
#container div.content div.wrap div.left-menu .left-box .resources ul li a.selected {
  background: url(img/icons/check-on.png) no-repeat;
  background-position: right;
}
#container div.content div.wrap div.left-menu .left-box a.go {
  float: left;
  margin-left: 10%;
  width: 35%;
  margin-top: 2%;
  font-family: "Bree Serif", serif;
  font-weight: 400;
  font-size: 18px;
  background: #f26c4f;
  background-position: right;
  padding: 5px 10px;
  color: #ffffff;
  text-decoration: none;
  text-transform: uppercase;
}
#container div.content div.wrap div.left-menu .left-box a.go:hover {
  background: #ef4824;
}
#container div.content div.wrap div.left-menu .left-box a.clear {
  float: right;
  margin-right: 8%;
  width: 40%;
  margin-top: 2%;
  font-family: "Bree Serif", serif;
  font-weight: 400;
  font-size: 18px;
  background: #006672;
  background-position: right;
  padding: 5px 10px;
  color: #ffffff;
  text-decoration: none;
  text-transform: uppercase;
}
#container div.content div.wrap div.left-menu .left-box a.clear:hover {
  background: #003d44;
}
#container div.content div.wrap div.inner-content {
  float: left;
  width: 100%;
  padding: 2% 2% 2% 0%;
}
#container div.content div.wrap div.inner-content .pagination {
  float: right;
  width: 100%;
}
#container div.content div.wrap div.inner-content .pagination .pagination {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  display: inline-block;
  margin-bottom: 20px;
  margin-left: 0;
  margin-right: 0;
  margin-top: 20px;
  padding-left: 0;
}
#container div.content div.wrap div.inner-content .pagination .pagination > li {
  display: inline;
}
#container div.content div.wrap div.inner-content .pagination .pagination > li > a,
#container div.content div.wrap div.inner-content .pagination .pagination > li > span {
  border: 1px solid #ddd;
  color: #00703c;
  float: left;
  line-height: 1.42857;
  margin-left: -1px;
  padding-bottom: 6px;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 6px;
  position: relative;
  margin-right: 5px;
  background: #ffffff;
  text-decoration: none;
}
#container div.content div.wrap div.inner-content .pagination .pagination > li:first-child > a,
#container div.content div.wrap div.inner-content .pagination .pagination > li:first-child > span {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
  margin-left: 0;
}
#container div.content div.wrap div.inner-content .pagination .pagination > li:last-child > a,
#container div.content div.wrap div.inner-content .pagination .pagination > li:last-child > span {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
}
#container div.content div.wrap div.inner-content .pagination .pagination > li > a:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > li > span:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > li > a:focus,
#container div.content div.wrap div.inner-content .pagination .pagination > li > span:focus {
  background-color: #eee;
  border-bottom-color: #ddd;
  border-left-color-ltr-source: physical;
  border-left-color-rtl-source: physical;
  border-left-color-value: #ddd;
  border-right-color-ltr-source: physical;
  border-right-color-rtl-source: physical;
  border-right-color-value: #ddd;
  border-top-color: #ddd;
  color: #23527c;
}
#container div.content div.wrap div.inner-content .pagination .pagination > .active > a,
#container div.content div.wrap div.inner-content .pagination .pagination > .active > span,
#container div.content div.wrap div.inner-content .pagination .pagination > .active > a:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > .active > span:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > .active > a:focus,
#container div.content div.wrap div.inner-content .pagination .pagination > .active > span:focus {
  background-color: #0c5962;
  color: #fff;
  cursor: default;
  z-index: 2;
}
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > span,
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > span:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > span:focus,
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > a,
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > a:hover,
#container div.content div.wrap div.inner-content .pagination .pagination > .disabled > a:focus {
  background-color: #fff;
  border-bottom-color: #ddd;
  border-left-color-ltr-source: physical;
  border-left-color-rtl-source: physical;
  border-left-color-value: #ddd;
  border-right-color-ltr-source: physical;
  border-right-color-rtl-source: physical;
  border-right-color-value: #ddd;
  border-top-color: #ddd;
  color: #777;
  cursor: not-allowed;
}
#container div.content div.wrap div.inner-content .full {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.inner-content .full h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #0093a7;
  border-bottom: 5px solid #0093a7;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full h2 {
  font-family: "Bree Serif", serif;
  font-size: 18px;
  color: #006672;
}
#container div.content div.wrap div.inner-content .full p {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  color: #006672;
}
#container div.content div.wrap div.inner-content .full ul {
  list-style: disc;
}
#container div.content div.wrap div.inner-content .full ul li {
  margin-left: 35px;
}
#container div.content div.wrap div.inner-content .full.habitat h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #0093a7;
  border-bottom: 5px solid #0093a7;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full.maps h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #fdb414;
  border-bottom: 5px solid #fdb414;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full.settlement h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #006672;
  border-bottom: 5px solid #006672;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full.economic h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #008d4c;
  border-bottom: 5px solid #008d4c;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full.exam h1 {
  font-family: "Bree Serif", serif;
  font-size: 36px;
  color: #83708b;
  border-bottom: 5px solid #83708b;
  padding-bottom: 5px;
  margin-bottom: 40px;
}
#container div.content div.wrap div.inner-content .full div.chapter-title {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.inner-content .full div.chapter-title .chapter {
  float: left;
  margin-right: 10px;
  margin-left: 5px;
  margin-top: 5px;
  font-family: "Bree Serif", serif;
  font-weight: 400;
  font-size: 28px;
  background: #f48479;
  background-position: right;
  padding: 10px 17px;
  color: #ffffff;
  text-decoration: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  text-transform: uppercase;
}
#container div.content div.wrap div.inner-content .full div.chapter-title h3 {
  float: left;
  width: 80%;
  font-family: "Bree Serif", serif;
  font-size: 28px;
  font-family: Arial;
  font-weight: 700;
  color: #006672;
}
#container div.content div.wrap div.inner-content .half {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.inner-content .half.right {
  margin-left: 0%;
}
#container div.content div.wrap div.inner-content .half.right .video-container {
  clear: left;
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
#container div.content div.wrap div.inner-content .half.right .video-container iframe,
#container div.content div.wrap div.inner-content .half.right .video-container object,
#container div.content div.wrap div.inner-content .half.right .video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#container div.content div.wrap div.inner-content .half.right img.step {
  width: 100%;
  max-width: 100%;
}
#container div.content div.wrap div.inner-content .half h1 {
  font-family: "Bree Serif", serif;
  font-size: 30px;
  color: green-header;
}
#container div.content div.wrap div.inner-content .half h2 {
  font-family: "Bree Serif", serif;
  font-size: 18px;
  color: #0093a7;
}
#container div.content div.wrap div.inner-content .half p {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  color: #006672;
}
#container div.content div.wrap div.inner-content .half ul {
  list-style: disc;
}
#container div.content div.wrap div.inner-content .half ul li {
  margin-left: 35px;
}
#container div.content div.wrap div.inner-content .half .summary {
  float: left;
  width: 100%;
  background: #ebebeb;
  padding: 15px 0;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .half .summary .image {
  float: left;
  width: 40%;
  margin: 0 3% 0 3%;
  border: 1px solid #ebebeb;
}
#container div.content div.wrap div.inner-content .half .summary .image img {
  max-width: 100%;
  width: 100%;
}
#container div.content div.wrap div.inner-content .half .summary .text {
  float: left;
  width: 54%;
  color: #006672;
}
#container div.content div.wrap div.inner-content .half .summary .text h3 {
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  padding: 0;
  margin: 0;
}
#container div.content div.wrap div.inner-content .half .summary .text h4 {
  font-family: "Bree Serif", serif;
  font-size: 20px;
  padding: 0;
  margin: 0;
  line-height: 1.1em;
}
#container div.content div.wrap div.inner-content .half .summary .text p {
  font-family: "Open Sans", sans-serif;
  font-size: 13px;
  padding: 0;
  margin: 0 0 15px 0;
}
#container div.content div.wrap div.inner-content .half .summary .text a {
  font-family: "Bree Serif", serif;
  color: #ffffff;
  background: #0f7581;
  padding: 5px 10px 10px 10px;
  font-size: 13px;
  text-decoration: none;
}
#container div.content div.wrap div.inner-content .resources-holder {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.inner-content .resources-holder h2 {
  font-size: 24px;
  font-family: "Bree Serif", serif;
  color: #006672;
  font-weight: 400;
}
#container div.content div.wrap div.inner-content .resources-holder .resource {
  float: left;
  width: 100%;
  margin-bottom: 20px;
  min-height: 240px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.margin {
  margin-left: 0%;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header {
  float: left;
  width: 100%;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .chapter {
  float: left;
  margin-left: 5px;
  margin-top: 5px;
  font-family: "Bree Serif", serif;
  font-weight: 400;
  font-size: 24px;
  background: #f48479;
  background-position: right;
  padding: 10px 15px;
  color: #ffffff;
  text-decoration: none;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  text-transform: uppercase;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .headings {
  float: left;
  width: 60%;
  margin-left: 10px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .headings h2 {
  font-size: 12px;
  font-weight: 400;
  margin: 5px 0 0 0;
  padding: 0;
  font-family: "Bree Serif", serif;
  color: #006672;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .headings h3 {
  font-size: 20px;
  font-weight: 400;
  margin: 0;
  padding: 0;
  font-family: "Bree Serif", serif;
  color: #006672;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .category {
  float: right;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .category .icon {
  float: right;
  padding: 10px 15px;
  color: #ffffff;
  font-size: 20px;
  margin-right: 0px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .header .category span.cat {
  float: left;
  font-size: 12px;
  font-family: "Open Sans", sans-serif;
  font-weight: bold;
  margin-top: 15px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .image {
  float: left;
  clear: left;
  width: 40%;
  margin: 10px;
  background: #ffffff;
  border: 1px solid #ebebeb;
  line-height: 0;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .image img {
  max-width: 100%;
  width: 100%;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text {
  float: left;
  width: 52%;
  padding: 10px 0px 0 0px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text h2 {
  font-size: 20px;
  font-weight: bold;
  margin: 5px 0 0 0;
  padding: 0;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text h3 {
  font-size: 18px;
  font-weight: normal;
  margin: 0;
  padding: 0;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text p {
  font-size: 13px;
  font-family: "Open Sans", sans-serif;
  padding: 0 0 10px 0;
  margin: 0 0 10px 0;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text a {
  color: #ffffff;
  font-family: "Bree Serif", serif;
  text-decoration: none;
  padding: 5px 10px;
  margin-bottom: 10px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.habitat-resource {
  background: #d5e6eb;
  background-position: bottom right;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.habitat-resource .category {
  background: #0093a7;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.habitat-resource a {
  background: #0093a7 !important;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.maps-resource {
  background: #ffefd8;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.maps-resource .category {
  background: #fbac19;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.maps-resource a {
  background: #fbac19 !important;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.settlement-resource {
  background: #cfd8dc;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.settlement-resource .category {
  background: #006672;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.settlement-resource a {
  background: #006672 !important;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.economic-resource {
  background: #d8e4d8;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.economic-resource .category {
  background: #008c4b;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.economic-resource a {
  background: #008c4b !important;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.exam-resource {
  background: #e4e0e5;
  margin-bottom: 20px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.exam-resource .category {
  background: #83708b;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.exam-resource a {
  background: #83708b !important;
}
#container table {
  border-spacing: 0;
  width: 100%;
}
#container .table {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  border-bottom-color: #ccc;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-image-outset: 0 0 0 0;
  border-image-repeat: stretch stretch;
  border-image-slice: 100% 100% 100% 100%;
  border-image-source: none;
  border-image-width: 1 1 1 1;
  border-left-color-ltr-source: physical;
  border-left-color-rtl-source: physical;
  border-left-color-value: #ccc;
  border-left-style-ltr-source: physical;
  border-left-style-rtl-source: physical;
  border-left-style-value: solid;
  border-left-width-ltr-source: physical;
  border-left-width-rtl-source: physical;
  border-left-width-value: 1px;
  border-right-color-ltr-source: physical;
  border-right-color-rtl-source: physical;
  border-right-color-value: #ccc;
  border-right-style-ltr-source: physical;
  border-right-style-rtl-source: physical;
  border-right-style-value: solid;
  border-right-width-ltr-source: physical;
  border-right-width-rtl-source: physical;
  border-right-width-value: 1px;
  border-top-color: #ccc;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-top-style: solid;
  border-top-width: 1px;
  box-shadow: 0 1px 1px #ccc;
}
#container .table tr:hover {
  background-attachment: scroll;
  background-clip: border-box;
  background-color: #fbf8e9;
  background-image: none;
  background-origin: padding-box;
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto auto;
  transition-delay: 0s;
  transition-duration: 0.1s;
  transition-property: all;
  transition-timing-function: ease-in-out;
}
#container .table td,
#container .bordered th {
  border-left-color-ltr-source: physical;
  border-left-color-rtl-source: physical;
  border-left-color-value: #ccc;
  border-left-style-ltr-source: physical;
  border-left-style-rtl-source: physical;
  border-left-style-value: solid;
  border-left-width-ltr-source: physical;
  border-left-width-rtl-source: physical;
  border-left-width-value: 1px;
  border-top-color: #ccc;
  border-top-style: solid;
  border-top-width: 1px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
  text-align: left;
}
#container .table th {
  background-color: #dce9f9;
  background-image: -moz-linear-gradient(center top, #ebf3fc, #dce9f9);
  border-top-color: -moz-use-text-color;
  border-top-style: none;
  border-top-width: medium;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
#container .table td:first-child,
#container .bordered th:first-child {
  border-left-color-ltr-source: physical;
  border-left-color-rtl-source: physical;
  border-left-color-value: -moz-use-text-color;
  border-left-style-ltr-source: physical;
  border-left-style-rtl-source: physical;
  border-left-style-value: none;
  border-left-width-ltr-source: physical;
  border-left-width-rtl-source: physical;
  border-left-width-value: medium;
}
#container .table th:first-child {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 6px;
  border-top-right-radius: 0;
}
#container .table th:last-child {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 6px;
}
#container .table th:only-child {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}
#container .table tr:last-child td:first-child {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
#container .table tr:last-child td:last-child {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 6px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
#container div.footer {
  background: #000000;
  float: left;
  width: 100%;
  padding: 20px;
  color: #ffffff;
}
#container div.footer div.wrap {
  text-align: center;
}
#container div.footer div.wrap a {
  color: #ffffff;
}
/*********************
03. LINK STYLES
*********************/
a,
a:visited {
  color: #f01d4f;
  /* on hover */
  /* on click */
  /* mobile tap color */
}
a:hover,
a:visited:hover,
a:focus,
a:visited:focus {
  color: #d10e3c;
}
a:link,
a:visited:link {
  /*
		this highlights links on iPhones/iPads.
		so it basically works like the :hover selector
		for mobile devices.
		*/
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3);
}
/******************************************************************
04. H1, H2, H3, H4, H5 STYLES
******************************************************************/
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  text-rendering: optimizelegibility;
  font-family: "Bree Serif", serif;
  font-weight: 400;
  /*
	if you're going to use webfonts, be sure to check your weights
	http://css-tricks.com/watch-your-font-weight/
	*/
  /* removing text decoration from all headline links */
}
h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a,
h5 a,
.h5 a {
  text-decoration: none;
}
h1,
.h1 {
  font-size: 30px;
  line-height: 1.333em;
  margin: 0;
  padding: 0;
}
h2,
.h2 {
  font-family: "Bree Serif", serif;
  font-size: 18px;
  line-height: 1.4em;
  font-weight: 400;
}
h3,
.h3 {
  font-size: 24px;
  line-height: 1.1em;
}