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

Stylesheet: Tablet & Small Desktop Stylesheet

Here's where you can start getting into the good stuff.
This size will work on iPads, other tablets, and desktops.
So you can start working with more styles, background images,
and other resources. You'll also notice the grid starts to
come into play. Have fun!

******************************************************************/
/*********************
GENERAL STYLES
*********************/
/*********************
LAYOUT & GRID STYLES
*********************/
div#main_wrapper div#background_wrapper div#title_box {
  display: none;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 {
  width: 768px;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-logo {
  float: left;
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div.login-characters {
  float: left;
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login {
  width: 768px;
  margin-top: 250px;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login span.login-title {
  display: none;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item {
  float: left;
  width: 50%;
  margin-left: 25%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item label#ContentPlaceHolderBody_Label_UserName {
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item label#ContentPlaceHolderBody_Label_Password {
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item input#ContentPlaceHolderBody_txtUserName {
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-item input#ContentPlaceHolderBody_txtUserPass {
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-checkbox {
  width: 50%;
  margin-left: 25%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .login-checkbox label#ContentPlaceHolderBody_Label_RememberMe {
  width: 50%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login #login-buttons {
  width: 50%;
  margin: 2% 25% 5% 25%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div.register {
  text-align: center;
  width: 90%;
  margin-left: 10%;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login div.register a {
  width: 38%;
  margin-right: 5px;
}
div#main_wrapper div#background_wrapper div#ContentPlaceHolderBody_UpdatePanel1 div#ContentPlaceHolderBody_pannel_login .account-links {
  width: 50%;
  margin-left: 25%;
}
.wrap {
  max-width: 100%;
}
#container {
  /* End Header */
}
#container .desktop {
  display: block;
}
#container .mobile {
  display: none!important;
}
#container .banner {
  float: left;
  width: 100%;
  background: #ffffff;
  padding-bottom: 0px;
}
#container .banner div.wrap {
  width: 768px;
}
#container .banner div.wrap .home {
  float: left;
  width: 20%;
  text-align: left;
}
#container .banner div.wrap .home img {
  max-width: 100%;
  width: 100%;
}
#container .banner div.wrap .navigation {
  float: right;
  text-align: right;
  width: 80%;
  margin-right: 0px;
  margin-bottom: 10px;
}
#container .banner div.wrap .navigation ul li {
  list-style: none;
  display: inline;
}
#container .banner div.wrap .navigation ul li a {
  float: right;
  width: auto;
  margin-left: 15px;
  margin-top: 5px;
  padding: 20px 10px;
  text-decoration: none;
  margin-bottom: 0px;
}
#container .holder {
  max-width: 768px;
}
#container .site-header {
  background: url(img/header-bg.png) no-repeat #0f7581 center center;
  height: 160px;
}
#container .site-header .wrap {
  width: 768px;
}
#container .site-header .wrap .logo {
  width: 45%;
  text-align: left;
  margin: 20px 20px;
}
#container .site-header .wrap .hex {
  display: block;
  position: relative;
  width: 42%;
  text-align: center;
  margin: 0;
}
#container div.content div.wrap {
  width: 100%;
  /* End Left Menu */
  /* End Inner Content */
}
#container div.content div.wrap div.left-menu {
  width: 28%;
}
#container div.content div.wrap div.left-menu .left-box h3 {
  float: left;
  width: 110%;
  text-transform: uppercase;
  color: #ffffff;
  background: url(img/h3-bg.png) no-repeat;
  background-position: right;
  font-size: 18px;
  padding: 15px 30px 25px 30px;
  margin-left: -5%;
}
#container div.content div.wrap div.inner-content {
  width: 72%;
  padding: 3% 2% 2% 2%;
}
#container div.content div.wrap div.inner-content .resources-holder .resource {
  min-height: 220px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .headings {
  float: left;
  width: 65%;
  margin-left: 10px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .image {
  float: left;
  clear: left;
  width: 45%;
  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 {
  width: 50%;
}
#container div.content div.wrap div.inner-content .resources-holder .resource .text a {
  background: url(img/launch-bg.png) no-repeat;
  color: #ffffff;
  font-family: "Open Sans", sans-serif;
  text-decoration: none;
  margin-bottom: 10px;
}
#container div.content div.wrap div.inner-content .resources-holder .resource.habitat-resource {
  background: url(img/habitat-resource-bg.jpg) no-repeat #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: url(img/maps-resource-bg.jpg) no-repeat #ffefd8;
  background-position: bottom right;
  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: url(img/settlement-resource-bg.jpg) no-repeat #cfd8dc;
  background-position: bottom right;
  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: url(img/economic-resource-bg.jpg) no-repeat #d8e4d8;
  background-position: bottom right;
  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: url(img/exam-resource-bg.jpg) no-repeat #e4e0e5;
  background-position: bottom right;
  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 div.content div.wrap div.inner-content .pagination {
  float: right;
  width: auto;
}
#container div.content div.wrap div.inner-content .full.right {
  margin-left: 0%;
}
#container div.content div.wrap div.inner-content .full h1 {
  font-size: 36px;
}
#container div.content div.wrap div.inner-content .full h2 {
  font-size: 20px;
}
#container div.content div.wrap div.inner-content .half.right {
  margin-left: 0%;
}
#container div.content div.wrap div.inner-content .half h1 {
  font-size: 30px;
}
#container div.content div.wrap div.inner-content .half h2 {
  font-size: 20px;
}
#container div.footer {
  background: #000000;
  float: left;
  width: 100%;
  padding: 20px;
  color: #ffffff;
}
#container div.footer div.wrap {
  text-align: right;
  max-width: 768px;
}
#container div.footer div.wrap a {
  color: #ffffff;
}
/* iPads (portrait) ----------- */