/*  GRID LAYOUT  */

html, body {
margin : 0;
padding : 0;
min-width : 100%;
width : 100%;
max-width : 100%;
min-height : 100%;
height : 100%;
max-height : 100%;
}
body {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 1em;
line-height : normal;
color : #000;
background-color : #e1edf7;
}
p {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 1em;
line-height : normal;
}
#quotes {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
color : #006699;
font-style : oblique;
}
#details {
margin-top : 0.5em;
margin-bottom : 0.5em;
border-bottom : 1px solid #e1edf7;
}
h1 {
font-size : 24px;
color : #006699;
line-height : normal;
}
@media only screen and (max-width:480px) {
h1 {
font-size : 18px;
line-height : normal;
}
}
h2 {
font-size : 18px;
color : #006699;
text-align : left;
line-height : normal;
}
h2.center {
font-size : 18px;
color : #006699;
text-align : center;
line-height : normal;
}
h3 {
font-size : 16px;
color : #006699;
line-height : normal;
}
h4 {
font-size : 14px;
color : #006699;
line-height : normal;
}
h5 {
font-size : 18px;
color: #FFF;
line-height: normal;
}
a:link {
text-decoration: underline;
color: #006699;
}
a:visited {
text-decoration: underline;
color: #006699;
}
a:hover {
text-decoration: underline;
color: #FF0000;
}
a:active {
text-decoration: underline;
text-align : left;
color: #FF0000;
font-weight: bold;
}
.center {
text-align : center;
}
.booktitles {
font-size : 18px;
color : #006699;
text-align : left;
}
@media only screen and (max-width:480px) {
.booktitles {
font-size : 14px;
line-height : normal;
}
}
.cat_bt {
text-align : left;
margin : 0;
padding : 0;
}
.imgpad {
padding : 2px;
}
.responsive-image {
height : auto;
width : 100%;
}
.responsive-button {
height : auto;
width : 100%;
max-width : 181px;
min-width : 90px;
}
.responsive-free-button {
height : auto;
width : 100%;
max-width : 195px;
}
.responsive-tblimage {
height : auto;
width : 100%;
max-height : 243px;
max-width : 280px;
display : block;
margin-left : auto;
margin-right : auto;
}
img.centered {
display : block;
margin-left : auto;
margin-right : auto;
}
.row {
clear : both;
width : 100%;
background : #FFF;
text-align : center;
}
.section {
clear : both;
padding : 0;
margin : 0;
width : 90%;
background : #FFF;
}
.sectionfull {
clear : both;
padding : 0;
margin : 0;
width : 100%;
background : #FFF;
}
.sectionblue {
clear : both;
padding : 0;
margin : 0;
width : 90%;
background : #006699;
}
.sectionpaleblue {
clear : both;
padding : 0;
margin : 0;
width : 100%;
background : #A6C7E0;
text-align : left;
height : 60px;
}
.sectionpaleblue2 {
clear : both;
padding : 0;
margin : 0;
width : 100%;
background : #A6C7E0;
text-align : center;
height : 100%;
min-height : 60px;
}
.sectionpaleblue3 {
clear : both;
padding : 0;
margin : 0;
width : 100%;
background : #A6C7E0;
text-align : center;
height : 100%;
min-height : 60px;
}
@media only screen and (max-width:768px) {
.sectionpaleblue2 {
min-height : 105px;
}
.sectionpaleblue3 {
min-height : 50px;
max-height : 105px;
}
}
.sectionpage {
clear : both;
padding : 0;
margin : 0;
width : 90%;
background : #FFF;
text-align : left;
}
.col {
display : block;
float : left;
margin : 1% 0 1% 1.6%;
}
.col:first-child {
margin-left : 0;
font-size : 14px;
color : #000;
}
.group:before, .group:after {
content : "";
display : table;
}
.group:after {
clear : both;
}
.span_logo {
width : 52.2%;
text-align : left;
padding : 0 10px;
}
.span_logotbl {
width : 70.2%;
text-align : left;
padding : 0 10px;
}
.span_logo1 {
width : 33.3%;
text-align : left;
padding : 0 10px;
vertical-align : bottom;
}
.span_logo2 {
width : 33.3%;
text-align : left;
padding : 0 10px;
vertical-align : bottom;
}
.span_language {
width : 22.2%;
max-height: 97px;
text-align: right;
padding: 20px 0;
}

.span_login p {
font-size: 0.9em;
line-height: 0;
text-align: right;
}

.span_login {
width: 15.3%;
vertical-align: middle;
padding: 0;
text-align: right;
}
@media only screen and (max-device-width:1024px) and (orientation:landscape) {
.span_logo {
width : 42.8%;
}

.span_logotbl {
width : 70.2%;
}
.span_language {
padding : 20px 0;
}
.span_login {
width : 22.2%;
}
}
@media only screen and (max-width:768px) {
.span_logo {
width : 42.8%;
}
.span_logotbl {
width : 48.8%;
}
.span_logo1 {
width : 42.8%;
text-align : center;
}
.span_logo2 {
width : 42.8%;
text-align : center;
}
.span_language {
width : 42.8%;
vertical-align : middle;
padding : 10px 0;
}
.span_login {
width : 42.8%;
}
}
@media only screen and (max-width:480px) {
.span_logo {
width : 100%;
text-align : center;
padding : 0;
}
.span_logotbl {
width : 100%;
text-align : center;
padding : 0;
}
.span_logo1 {
width : 42.2%;
padding : 0;
}
.span_logo2 {
width : 42.2%;
text-align : center;
padding : 0;
}
.span_language {
width : 48%;
text-align : left;
}
.span_login {
width : 48%;
padding : 0;
}
}
.span_mmenu {
width : 76%;
background : #006699;
}
.span_search {
width : 24%;
background : #006699;
}
@media only screen and (max-width:480px) {
.span_mmenu {
width : 100%;
}
.span_search {
width : 100%;
}
}
#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #menu-button {
margin : 0;
padding : 0;
border : 0;
list-style : none;
line-height : 1;
display : block;
position : relative;
box-sizing : border-box;
z-index : 11;
}
#cssmenu:after, #cssmenu > ul:after {
content : ".";
display : block;
clear : both;
visibility : hidden;
line-height : 0;
height : 0;
}
#cssmenu #menu-button {
display : none;
}
#cssmenu {
width : auto;
border-radius : 5px;
font-family : 'Open Sans', Helvetica, sans-serif;
background : #006699;
}
#cssmenu.align-center > ul {
font-size : 0;
text-align : center;
}
#cssmenu.align-center ul ul {
text-align : left;
}
#cssmenu.align-center > ul > li {
display : inline-block;
float : none;
}
#cssmenu.align-right > ul > li {
float : right;
}
#cssmenu.align-right ul ul {
text-align : right;
}
#cssmenu > ul > li {
float : left;
}
#cssmenu > ul > li > a {
padding : 20px 15px;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
color : #ffffff;
text-transform : uppercase;
letter-spacing : 1px;
text-shadow : 0 1px 0 rgba(0, 0, 0, 0.25);
font-weight : 700;
text-decoration : none;
transition : color 0.2s ease;
}
#cssmenu > ul > li:hover > a, #cssmenu > ul > li > a:hover, #cssmenu > ul > li.active > a {
color : #cae5fd;
}
#cssmenu > ul > li.has-sub > a {
padding-right : 40px;
z-index : 12;
}
#cssmenu ul > li.has-sub > a:after {
content : '';
position : absolute;
right : 5px;
top : 17.5px;
display : block;
width : 18px;
height : 18px;
border-radius : 9px;
background : #006699;
box-shadow : 0 -1px 1px #209ed0 inset, 0 2px 1px #7fcceb inset;
background-size : 36px 36px;
background-position : 0 0;
background-repeat : no-repeat;
transition : all 0.1s ease-out;
}
#cssmenu ul > li.has-sub:hover > a:after {
background-position : 0 -18px;
}
#cssmenu ul > li.has-sub > a:before {
content : '';
position : absolute;
right : 11px;
top : 25.5px;
display : block;
width : 0;
height : 0;
border : transparent solid 3px;
border-top-color : #ffffff;
z-index : 99;
}
#cssmenu ul > li.has-sub:hover > a:before {
border-top-color : #ffffff;
}
#cssmenu ul ul {
position : absolute;
left : -9999px;
opacity : 0;
transition : top 0.2s ease, opacity 0.2s ease;
}
#cssmenu > ul > li > ul {
top : 91px;
padding-top : 8px;
border-radius : 8px;
}
#cssmenu > ul > li:hover > ul {
left : auto;
top : 51px;
opacity : 1;
}
#cssmenu.align-right > ul > li:hover > ul {
right : 0;
}
#cssmenu ul ul ul {
top : 40px;
}
#cssmenu ul ul > li:hover > ul {
top : 0;
left : 178px;
padding-left : 10px;
opacity : 1;
}
#cssmenu.align-right ul ul > li:hover > ul {
left : auto;
right : 178px;
padding-left : 0;
padding-right : 10px;
opacity : 1;
}
#cssmenu ul ul li a {
width : 180px;
padding : 12px 25px;
font-size : 13px;
font-weight : 700;
text-shadow : 0 1px 0 rgba(0, 0, 0, 0.25);
color : #ffffff;
text-decoration : none;
background : #006699;
transition : color 0.2s ease;
}
#cssmenu ul ul li:hover > a, #cssmenu ul ul li > a:hover, #cssmenu ul ul li.active > a {
color : #a6c7e0;
}
#cssmenu ul ul li:first-child > a {
border-top-left-radius : 5px;
border-top-right-radius : 5px;
box-shadow : 0 2px 2px #a6c7e0 inset;
}
#cssmenu ul ul li:last-child > a {
border-bottom-left-radius : 5px;
border-bottom-right-radius : 5px;
box-shadow : 0 -3px 0 #a6c7e0 inset, 0 -3px 3px #1f9acc inset, 0 1px 1px rgba(0, 0, 0, 0.03), 0 2px 2px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.13);
}
#cssmenu ul ul > li.has-sub > a:after {
right : 12px;
top : 9.5px;
background : #006699;
box-shadow : 0 -1px 1px #a6c7e0 inset, 0 2px 1px #a6c7e0 inset;
background-size : 36px 36px;
background-position : 0 0;
background-repeat : no-repeat;
}
#cssmenu.align-right ul ul > li.has-sub > a:after {
right : auto;
left : 12px;
}
#cssmenu ul ul > li.has-sub:hover > a:after {
background-position : 0 -18px;
}
#cssmenu ul ul > li.has-sub > a:before {
top : 15.5px;
right : 16px;
border-top-color : transparent;
border-left-color : #ffffff;
}
#cssmenu.align-right ul ul > li.has-sub > a:before {
top : 15.5px;
right : auto;
left : 16px;
border-top-color : transparent;
border-right-color : #ffffff;
border-left-color : transparent;
}
#cssmenu ul ul > li.has-sub:hover > a:before {
border-top-color : transparent;
border-left-color : #ffffff;
}
#cssmenu.align-right ul ul > li.has-sub:hover > a:before {
border-top-color : transparent;
border-left-color : transparent;
border-right-color : #ffffff;
}
@media only screen and (max-width:768px) {
#cssmenu {
width : 100%;
}
#cssmenu ul, #cssmenu ul ul, #cssmenu ul ul ul, #cssmenu > ul, #cssmenu.align-center > ul, #cssmenu > ul > li > ul, #cssmenu > ul > li:hover > ul, #cssmenu ul ul li:hover > ul, #cssmenu ul ul ul li:hover > ul, #cssmenu.align-right ul ul, #cssmenu.align-right ul ul li:hover > ul, #cssmenu.align-right ul ul ul li:hover > ul {
position : relative;
left : 0;
right : auto;
top : 0;
width : 100%;
display : none;
padding : 0;
opacity : 1;
text-align : left;
}
#cssmenu ul li {
width : 100%;
border-top : 1px solid #FFF;
}
#cssmenu > ul > li > a, #cssmenu ul ul li a, #cssmenu ul ul li:first-child > a, #cssmenu ul ul li:last-child > a {
width : 100%;
border-radius : 0;
box-shadow : none;
background : none;
}
#cssmenu ul li a {
padding-left : 12.5px;
}
#cssmenu ul ul li a {
padding : 14px 25px 14px 27.5px;
}
#cssmenu ul ul ul li a {
padding-left : 42.5px;
}
#cssmenu ul ul ul ul li a {
padding-left : 57.5px;
}
#cssmenu > ul > li.has-sub > a:after, #cssmenu > ul > li.has-sub > a:before, #cssmenu ul ul li.has-sub > a:after, #cssmenu ul ul li.has-sub > a:before {
display : none;
}
#cssmenu #menu-button {
position : relative;
display : block;
padding : 20px;
padding-left : 12.5px;
cursor : pointer;
font-size : 13px;
color : #ffffff;
text-shadow : 0 1px 0 rgba(0, 0, 0, 0.25);
font-weight : 700;
letter-spacing : 1px;
text-transform : uppercase;
}
#cssmenu .submenu-button {
position : absolute;
right : 0;
display : block;
width : 53px;
height : 53px;
border-left : 1px solid #FFF;
z-index : 10;
cursor : pointer;
}
#cssmenu ul ul .submenu-button {
height : 41px;
}
#cssmenu ul .submenu-button:after, #cssmenu #menu-button:after {
content : '';
position : absolute;
right : 12.5px;
top : 12.5px;
display : block;
width : 28px;
height : 28px;
border-radius : 15px;
background : #006699;
box-shadow : 0 -1px 1px #a6c7e0 inset, 0 2px 1px #a6c7e0 inset;
background-size : 56px 56px;
background-position : 0 0;
background-repeat : no-repeat;
transition : all 0.1s ease-out;
}
#cssmenu ul .submenu-button.submenu-opened:after, #cssmenu #menu-button.menu-opened:after {
background-position : 0 -28px;
}
#cssmenu ul ul .submenu-button:after {
top : 6.5px;
}
#cssmenu #menu-button:before, #cssmenu .submenu-button:before {
content : '';
position : absolute;
right : 22.5px;
top : 25.5px;
display : block;
width : 0;
height : 0;
border : transparent solid 4px;
border-top-color : #ffffff;
z-index : 99;
}
#cssmenu ul ul .submenu-button:before {
top : 19.5px;
}
#cssmenu #menu-button.menu-opened:before, #cssmenu .submenu-button.submenu-opened:before {
border-top-color : #ffffff;
}
}
@media only screen and (max-width:360px) {
#cssmenu {
width : 100%;
}
#cssmenu ul, #cssmenu ul ul, #cssmenu ul ul ul, #cssmenu > ul, #cssmenu.align-center > ul, #cssmenu > ul > li > ul, #cssmenu > ul > li:hover > ul, #cssmenu ul ul li:hover > ul, #cssmenu ul ul ul li:hover > ul, #cssmenu.align-right ul ul, #cssmenu.align-right ul ul li:hover > ul, #cssmenu.align-right ul ul ul li:hover > ul {
position : relative;
left : 0;
right : auto;
top : 0;
width : 100%;
display : none;
padding : 0;
opacity : 1;
text-align : left;
}
#cssmenu ul li {
width : 100%;
border-top : 1px solid #FFF;
}
#cssmenu > ul > li > a, #cssmenu ul ul li a, #cssmenu ul ul li:first-child > a, #cssmenu ul ul li:last-child > a {
width : 100%;
border-radius : 0;
box-shadow : none;
background : none;
}
#cssmenu ul li a {
padding-left : 8.5px;
}
#cssmenu ul ul li a {
padding : 14px 25px 14px 27.5px;
}
#cssmenu ul ul ul li a {
padding-left : 42.5px;
}
#cssmenu ul ul ul ul li a {
padding-left : 57.5px;
}
#cssmenu > ul > li.has-sub > a:after, #cssmenu > ul > li.has-sub > a:before, #cssmenu ul ul li.has-sub > a:after, #cssmenu ul ul li.has-sub > a:before {
display : none;
}
#cssmenu #menu-button {
position : relative;
display : block;
padding : 20px;
padding-left : 12.5px;
cursor : pointer;
font-size : 9px;
color : #ffffff;
text-shadow : 0 1px 0 rgba(0, 0, 0, 0.25);
font-weight : 700;
letter-spacing : 1px;
text-transform : uppercase;
}
#cssmenu .submenu-button {
position : absolute;
right : 0;
display : block;
width : 53px;
height : 53px;
border-left : 1px solid #FFFFFF;
z-index : 10;
cursor : pointer;
}
#cssmenu ul ul .submenu-button {
height : 41px;
}
#cssmenu ul .submenu-button:after, #cssmenu #menu-button:after {
content : '';
position : absolute;
right : 12.5px;
top : 12.5px;
display : block;
width : 28px;
height : 28px;
border-radius : 15px;
background : #006699;
box-shadow : 0 -1px 1px #a6c7e0 inset, 0 2px 1px #a6c7e0 inset;
background-size : 56px 56px;
background-position : 0 0;
background-repeat : no-repeat;
transition : all 0.1s ease-out;
}
#cssmenu ul .submenu-button.submenu-opened:after, #cssmenu #menu-button.menu-opened:after {
background-position : 0 -28px;
}
#cssmenu ul ul .submenu-button:after {
top : 6.5px;
}
#cssmenu #menu-button:before, #cssmenu .submenu-button:before {
content : '';
position : absolute;
right : 22.5px;
top : 25.5px;
display : block;
width : 0;
height : 0;
border : transparent solid 4px;
border-top-color : #ffffff;
z-index : 99;
}
#cssmenu ul ul .submenu-button:before {
top : 19.5px;
}
#cssmenu #menu-button.menu-opened:before, #cssmenu .submenu-button.submenu-opened:before {
border-top-color : #ffffff;
}
}
html {
width : 100%;
}
div.row {
width : 100%;
}
div.row:before, div.row:after {
content : "";
display : table;
}
div.row:after {
clear : both;
}
div.row .column {
width : 20%;
float : left;
text-align : center;
overflow : hidden;
}
div.row .column2 {
width : 15%;
float : left;
text-align : center;
overflow : hidden;
padding : 5px;
}
.bookcover {
width : auto;
max-width: 150px;
padding : 10px;
}
a:hover img.bookcover {
box-shadow : 0 8px 6px -6px black;
}
#book {
width : auto;
padding : 10px;
}
#graphicnovel {
width : auto;
padding : 10px;
}
#video {
width : auto;
padding : 10px;
}
@media only screen and (max-width:768px) {
#book {
width : 100%;
padding : 8px;
}
#graphicnovel {
width : 100%;
padding : 8px;
}
#video {
width : 100%;
padding : 8px;
}
}
@media only screen and (max-width:480px) {
#book {
width : 100%;
padding : 5px;
}
#graphicnovel {
width : 100%;
padding : 5px;
}
#video {
width : 100%;
padding : 5px;
}
}
.span_fullpage {
width : 90%;
margin : 0 20px;
max-width : 900px;
background : #FFF;
color : #000;
}
.footer {
clear : both;
padding : 0;
margin : 0;
width : 100%;
background : #006699;
text-align : center;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : 700;
color : #FFF;
}
.footernav p {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : 700;
color : #FFF;
}
.footernav a {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : 700;
color : #FFF;
text-transform : none;
text-decoration : none;
padding-right : 10px;
padding-left : 10px;
}
.footernav a:hover {
color : #e6eff7;
}
.copyright p {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : bold;
color : #FFFFFF;
}
.span_copyright {
width : 14%;
margin : 15px 5px;
}
.span_footernav {
margin : 15px 5px;
}
.span_admin {
margin : 2px;
text-align : center;
}
.span_social {
margin : 2px;
text-align : right;
}
.span_apps {
margin : 2px;
text-align : right;
display : inline;
}
@media only screen and (max-width:1024px) and (orientation:landscape) {
.span_copyright {
width : 22.2%;
margin : 15px 5px;
text-align : center;
}
.span_footernav {
margin : 15px 5px;
text-align : center;
}
.span_admin {
margin : 2px;
text-align : right;
}
.span_social {
margin : 2px;
text-align : right;
}
}
@media only screen and (max-width:768px) {
.span_copyright {
width : 22.2%;
margin : 15px 5px;
text-align : center;
}
.span_footernav {
margin : 15px 5px;
text-align : center;
}
.span_admin {
margin : 2px;
text-align : right;
}
.span_social {
margin : 2px;
text-align : right;
}
}
@media only screen and (max-width:640px) {
.span_copyright {
width : 28.2%;
margin : 15px 5px;
text-align : center;
}
.span_footernav {
margin : 15px 5px;
text-align : center;
}
.span_admin {
margin : 2px;
text-align : right;
}
.span_social {
margin : 2px;
text-align : right;
}
}
@media only screen and (max-width:480px) {
.span_copyright {
width : 100%;
text-align : center;
}
.span_footernav {
width : 100%;
margin : 2px;
text-align : center;
}
.span_admin {
margin : 2px;
text-align : right;
}
.span_social {
text-align : right;
}
}
.clearfix:after {
display : block;
clear : both;
}
.menu-wrap {
width : 100%;
box-shadow : 0 1px 3px rgba(0, 0, 0, 0.2);
background : #a6c7e0;
margin-left : 0;
}
.menu {
width : 100%;
margin : 0;
text-align : left;
padding : 0;
}
.menu ul {
margin : 0;
list-style : none;
padding : 0;
}
.menu li {
margin : 0;
list-style : none;
padding : 0;
}
.menu a {
transition : all 0.15s linear;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : 700;
color : #006699;
background : #a6c7e0;
}
.menu li:hover > a, .menu .current-item > a {
font-weight : 700;
color : #FFF;
}
.menu .arrow {
font-size : 11px;
line-height : 0%;
}
.menu > ul > li {
float : left;
display : inline-block;
position : relative;
font-size : 14px;
text-align : left;
}
.menu > ul > li > a {
padding : 10px 10px;
display : inline-block;
text-shadow : 0 1px 0 rgba(0, 0, 0, 0.4);
}
.menu > ul > li:hover > a, .menu > ul > .current-item > a {
background : #a6c7e0;
}
.menu li:hover .sub-menu {
z-index : 1;
opacity : 1;
}
.sub-menu {
width : 100%;
padding : 5px 0;
position : absolute;
top : 49px;
left : 0;
z-index : -1;
opacity : 0;
transition : opacity 0.15s linear;
box-shadow : 0 2px 3px rgba(0, 0, 0, 0.2);
background : #a6c7e0;
}
.sub-menu li {
display : block;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
}
.sub-menu li a {
padding : 10px 10px;
display : block;
}
.sub-menu li a:hover, .sub-menu .current-item a {
background : #006699;
}
#demo {
position : relative;
margin : 0 auto;
width : 90%;
padding : 0 30px;
}
#demo {
line-height : 20px;
}
#demo hr {
margin-top : 20px;
}
.title {
display : inline-block;
font-size : 32px;
vertical-align : middle;
margin-right : 40px;
line-height : 24px;
margin-top : 5px;
}
#info p {
font-size : 12px;
color : #bbb;
padding : 6px 15px;
}
#info p a {
margin : 0 5px;
}
#info .callbacks span {
color : #fff;
}
#examples {
background-color : #fff;
padding : 5px;
margin : 10px 0;
overflow : hidden;
width : 90%;
}
#examples.light {
background-color : #fff;
}
#examples > hr {
margin : 20px 10px;
}
.span_bookcover {
width : 20%;
text-align : left;
margin : 26px 0 0 0;
}
.span_bookcover img {
width : 90%;
text-align : left;
display : block;
margin-bottom : 10px;
}
.span_bookcover input {
width : 90%;
text-align : left;
display : block;
margin-bottom : 10px;
}
.span_description {
width : 56%;
text-align : left;
}
.span_details {
width : 20%;
text-align : left;
}
@media only screen and (max-width:768px) {
.span_bookcover {
width : 30%;
}
.span_description {
width : 42%;
}
.span_details {
width : 24%;
}
}
@media only screen and (max-width:640px) {
.span_bookcover {
width : 36%;
}
.span_description {
width : 36%;
}
.span_details {
width : 24%;
}
}
@media only screen and (max-width:480px) {
.span_bookcover {
width : 100%;
}
.span_description {
width : 100%;
}
.span_details {
width : 100%;
}
}
.span_testimonials {
width : 80%;
text-align : center;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
font-weight : 700;
color : #000;
}
table.testimonials {
width : 100%;
text-align : center;
margin-bottom : 20px;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
font-weight : 700;
color : #000;
}
.testimonials tr {
padding-bottom : 10px;
}
.testimonials td {
padding : 5px 10px;
text-align : center;
border : #006699 solid 3px;
border-radius : 20px;
}
.testimonials tr:nth-child(even) {
background-color : #e6eff7;
}
.testimonials tr:nth-child(odd) {
background-color : #f2f7fb;
}
.testimonials tr:hover {
background-color : #cee0ef;
}
@media only screen and (max-width:480px) {
.span_testimonials {
width : 80%;
}
table.testimonials {
width : 80%;
}
}
.span_catmenu {
width : 48.2%;
margin : 0;
background : #A6C7E0;
}
.span_advancedsearch {
width : 48.2%;
margin-top : 10px;
background : #A6C7E0;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 18px;
font-weight : bold;
line-height : 20px;
color : #FFFFFF;
text-align : right;
}
.span_advancedsearch2 {
width : 18.8%;
margin-top : 10px;
background : #A6C7E0;
text-align : right;
}
@media only screen and (max-width:1024px) and (orientation:landscape) {
.span_catmenu {
width : 48.2%;
}
.span_advancedsearch {
width : 48.2%;
}
.span_advancedsearch2 {
width : 21.2%;
}
}
@media only screen and (max-width:768px) {
.span_catmenu {
width : 44.2%;
}
.span_advancedsearch {
width : 48.2%;
}
.span_advancedsearch2 {
width : 25.5%;
}
}
@media only screen and (max-width:640px) {
.span_catmenu {
width : 48.2%;
}
.span_advancedsearch {
width : 42.2%;
}
.span_advancedsearch2 {
width : 18.8%;
}
}
@media only screen and (max-width:480px) {
.span_catmenu {
width : 48.2%;
}
.span_advancedsearch {
width : 48.2%;
}
}
.tblsearch body {
background : #FFF;
color : #000000;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
font-weight : bold;
line-height : 20px;
}
.tblsearch a {
color : #006699;
text-decoration : none;
}
.tblsearch a:hover {
text-decoration : underline;
}
.container, .main {
width : 220px;
margin-left : auto;
margin-right : auto;
height : auto;
}
.main {
margin-top : auto;
}
.tblsearch {
position : relative;
margin : 0 auto;
width : 200px;
}
.tblsearch input {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 16px;
color : #000000;
height : 30px;
width : 100%;
padding : 0 12px 0 35px;
background : url("../../images/tf-search-icon.png") 0 0 no-repeat white;
border-width : 1px;
border-style : solid;
border-color : #006699;
border-radius : 2px;
box-sizing : border-box;
box-shadow : 0 1px #A6C7E0 inset, 0 1px 0 #fcfcfc;
}
.tblsearch input:focus {
outline : none;
border-color : #006699;
box-shadow : 0 0 2px rgba(85, 168, 236, 0.9);
}
.tblsearch input:focus + .results {
display : block;
}
.tblsearch .results {
display : none;
position : absolute;
top : 35px;
left : 0;
right : 0;
z-index : 10;
padding : 0;
margin : 0;
border-width : 1px;
border-style : solid;
border-color : #006699;
border-radius : 3px;
background-color : #A6C7E0;
}
.tblsearch .results li {
display : block;
}
.tblsearch .results li:first-child {
margin-top : -1px;
}
.tblsearch .results li:first-child:before, .tblsearch .results li:first-child:after {
display : block;
content : '';
width : 0;
height : 0;
position : absolute;
left : 50%;
margin-left : -5px;
border : transparent outset 5px;
}
.tblsearch .results li:first-child:before {
border-bottom : 5px solid #006699;
top : -11px;
}
.tblsearch .results li:first-child:after {
border-bottom : 5px solid #006699;
top : -10px;
}
.tblsearch .results li:first-child:hover:before, .search .results li:first-child:hover:after {
display : none;
}
.tblsearch .results li:last-child {
margin-bottom : -1px;
}
.tblsearch .results a {
display : block;
position : relative;
margin : 0 -1px;
padding : 6px 40px 6px 10px;
color : #006699;
font-weight : 700;
border : transparent solid 1px;
border-radius : 3px;
}
.tblsearch .results a span {
font-weight : 200;
}
.tblsearch .results a:before {
content : '';
width : 18px;
height : 18px;
position : absolute;
top : 50%;
right : 10px;
margin-top : -9px;
background : url("../../images/search-arrow.png") 0 0 no-repeat;
}
.tblsearch .results a:hover {
text-decoration : none;
color : #fff;
border-color : #A6C7E0;
background-color : #006699;
}
:-moz-placeholder {
color : #006699;
font-weight : 700;
}
::-webkit-input-placeholder {
color : #006699;
font-weight : 700;
}
.lt-ie9 .search input {
line-height : 26px;
}
.span_full {
width : 100%;
vertical-align : top;
}
.span_half {
width : 49.2%;
vertical-align : top;
text-align : left;
}
.span_pagetitle {
width : 68.2%;
text-align : left;
}
.span_viewall {
width : 28.2%;
text-align : center;
}
.span_1_third {
width : 31.4%;
vertical-align : top;
text-align : left;
}
.span_2_third {
width : 62.8%;
vertical-align : top;
}
.span_1fourth {
width : 23.3%;
vertical-align : top;
}
.span_3fourth {
width : 70.6%;
vertical-align : top;
}
@media only screen and (max-width:640px) {
.span_full {
width : 100%;
}
.span_half {
width : 48.2%;
}
.span_pagetitle {
width : 42.2%;
padding-left : 20px;
}
.span_viewall {
width : 44.4%;
vertical-align : top;
padding-right : 20px;
text-align : right;
}
.span_1_third {
width : 31.4%;
vertical-align : top;
}
.span_2_third {
width : 62.8%;
}
.span_1fourth {
width : 20.8%;
}
.span_3fourth {
width : 70.6%;
}
}
@media only screen and (max-width:480px) {
.span_full {
width : 100%;
}
.span_half {
width : 100%;
}
.span_pagetitle {
width : 100%;
vertical-align : top;
padding-left : 20px;
}
.span_viewall {
width : 100%;
vertical-align : top;
padding-right : 20px;
text-align : right;
}
.span_1_third {
width : 100%;
}
.span_2_third {
width : 100%;
}
.span_1fourth {
width : 100%;
}
.span_3fourth {
width : 100%;
}
}
.span_images1 {
width : 16.2%;
}
.span_images1 img {
width : 100%;
}
.span_text1 {
width : 28.8%;
}
.span_images2 {
width : 16.2%;
}
.span_images2 img {
width : 100%;
}
.span_text2 {
width : 28.8%;
}
@media only screen and (max-width:480px) {
.span_images1 {
width : 100%;
}
.span_images1 img {
width : 100%;
}
.span_text1 {
width : 100%;
}
.span_images2 {
width : 100%;
}
.span_images2 img {
width : 100%;
}
.span_text2 {
width : 100%;
}
}
table.legend {
width : auto;
background : #FFF;
font-size : 14px;
font-weight : 700;
}
table.legend tr {
width : auto;
padding : 2px;
vertical-align : top;
}
table.legend td {
width : auto;
padding : 2px 10px 2px 2px;
vertical-align : middle;
}
table.collection {
width : 100%;
padding : 0;
text-align : left;
}
table.collection tr {
width : auto;
padding : 0;
vertical-align : top;
}
table.collection th {
width : auto;
padding : 5px;
vertical-align : middle;
background-color : #A7C843;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 18px;
font-weight : 700;
}
table.collection tr:nth-child(even) {
background : #fee8a5;
}
table.collection tr:nth-child(odd) {
background : #fdc61e;
}
table.collection td {
width : auto;
padding : 5px;
text-align : left;
vertical-align : middle;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 14px;
font-weight : 700;
color : #000;
}
.bookDescrption a:link {
color : #006699;
text-decoration : underline;
}
.bookDescrption a:visited {
text-decoration : none;
font-weight : bold;
color : #000000;
}
.bookDescrption a:hover {
text-decoration : none;
font-weight : bold;
color : #FF0000;
}
.bookDescrption a:active {
text-decoration : none;
font-weight : bold;
color : #FF0000;
}
.TitleRow {
font-size : 18px;
text-align : left;
text-indent : 10px;
}
.TitleRow a:link {
color : #006699;
text-decoration : underline;
}
.TitleRown a:visited {
text-decoration : none;
font-weight : bold;
color : #000000;
}
.TitleRow a:hover {
text-decoration : none;
font-weight : bold;
color : #FF0000;
}
.TitleRow a:active {
text-decoration : none;
font-weight : bold;
text-align : left;
color : #FF0000;
}
table.index {
width : 100%;
padding : 0;
margin : 0;
background : #FFF;
}
table.index tr {
width : auto;
padding : 5px;
vertical-align : top;
}
table.index td {
width : auto;
padding : 5px;
vertical-align : middle;
}
table.contact {
width : 100%;
padding : 0;
margin : 0;
background : #FFF;
}
table.contact tr {
width : auto;
}
table.contact td {
width : 60%;
padding : 5px;
vertical-align : top;
}
.index a:link {
text-decoration : none;
font-weight : bold;
color : #006699;
}
.index a:visited {
text-decoration : none;
font-weight : bold;
color : #FF0000;
}
.index a:hover {
text-decoration : none;
font-weight : bold;
color : #FF0000;
}
.index a:active {
text-decoration : none;
font-weight : bold;
text-align : left;
color : #FF0000;
}
.index {
font-weight : bold;
}
.tabBg2 {
background-color : #fee8a5;
}
.TabbedPanels {
margin: 0;
padding: 0;
clear: both;
width: 100%;
}
.TabbedPanelsTabGroup {
margin: 0;
padding: 0;
}
.TabbedPanelsTab {
position: relative;
top: 1px;
float: left;
padding: 6px 12px;
margin: 0 1px 0 0;
background-color: #a6c3fc;
list-style: none;
border-left: 1px solid #a6c3fc;
border-bottom: 1px solid #6699ff;
border-top: 1px solid #a6c3fc;
border-right: 1px solid #a6c3fc;
cursor: pointer;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 16pt;
font-weight: bold;
color: #000;
}
.TabbedPanelsTabHover {
background-color: #6699ff;
color: #fff;
}
.TabbedPanelsTabSelected {
background-color: #6699ff;
color: #FFF;
border: #6699ff solid 1px;
}
TabbedPanelsContentVisible td {
padding: 6px;
}
.TabbedPanelsTab a {
color : black;
text-decoration : none;
}
.TabbedPanelsContentGroup {
clear: both;
border: #6699ff solid 1px;
background-color: #FFFFFF;
}
.TabbedPanelsContent {
padding: 0;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 12px;
}
.TabbedPanelsContent tr td {
padding: 10px;
}
.TabbedPanelsContent a {
color: #000;
margin-right: 12px;
font-size: 12px;
}
.popupcontainer {
background-color : #ffffff;
min-width : 100%;
width: 100%;
min-height: 150px;
height: 100%;
padding: 0;
}
.sans-1 {
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 11pt;
font-style: normal;
line-height: 13pt;
font-weight: normal;
font-variant: normal;
text-transform: none;
color: #000000;
text-decoration: none;
}
.sansbold18red {
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 24px;
font-style: normal;
line-height: normal;
font-weight: bold;
font-variant: normal;
text-transform: none;
color: #FF0000;
text-decoration: none;
}
.bookTitle {
font-size : 14pt;
color : #006699;
font-weight : bold;
}
user agent stylesheet input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
background-color: rgb(225, 237, 247);
background-image: none;
color: rgb(0, 0, 0);
}
user agent stylesheet input {
padding : 1px;
background-color : white;
border : inset 2px;
border-image-source : initial;
border-image-slice : initial;
border-image-width : initial;
border-image-outset : initial;
border-image-repeat : initial;
cursor : auto;
}
user agent stylesheet input, textarea, keygen, select, button {
margin: 0;
font: 11px "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
text-rendering: auto;
color: inherit;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0;
text-shadow: none;
display : inline-block;
text-align : start;
}
.btnMycloud {
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 16px;
cursor: pointer;
color: #000000;
background: url('http://cdn.tumblebooks.com/images/btn_bg.jpg');
border: 0;
height: 35px;
width: 124px;
}
.btnSubmit {
display: block;
font-family: "Open Sans", "Open Sans Bold", "Arial", "Arial Bold", "Helvetica";
font-size: 16px;
cursor: pointer;
height: 34px;
width: 123px;
border: 0;
background-position: top left;
background-repeat: no-repeat;
background-image: url('http://cdn.tumblebooks.com/images/btn_submit.gif');
}
.loginbox {
background-color: #FFF;
background-image: none;
color: #006699;
width: 116px;
height: 20px;
border-radius: 5px;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 14px;
text-align: left;
text-indent: 5px;
}
.searchfield {
background-color: #FFF;
background-image: none;
color: #006699;
width: 220px;
height: 30px;
border-radius: 5px;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size: 18px;
text-align: left;
text-indent: 5px;
margin: 0;
}
table.booksearch {
width : 420px;
height : 331px;
border : 0;
padding : 10px;
background : url(../../images/bookcover.jpg) no-repeat;
text-align : center;
}
#formentry td {
width: 360px;
border: 0;
text-align: right;
}
#searchbtn td {
width: 60px;
border: 0;
text-align: left;
}
table.searchboxes {
width : 100%;
height : auto;
border : 0;
padding : 10px;
text-align : center;
}
table.searchgrid {
width: 50%;
max-width : 540px;
height : 600px;
border : 0;
padding : 10px;
text-align : center;
margin-left : auto;
margin-right : auto;
}
.searchgrid label { 
color: #FFFFFF; 
font-weight: bold; 
line-height: 1.5em;
display: block; 
width: auto;
margin-bottom: 10px;} 

.searchgrid label:after { content: ": " }

#searchboxes td {
text-align : center;
}
#blueheader {
background-color: #006699;
width: 260px;
height: 130px;
padding: 10px 0 0 0;
font-size: 20px;
font-weight: 700;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color: #FFFFFF;
border-radius: 20px;
}
#purpleheader {
background-color: #93F;
width: 260px;
height: 130px;
padding: 10px 0 0 0;
font-size: 20px;
font-weight: 700;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color: #FFFFFF;
border-radius: 20px;
}
#greenheader {
background-color : #090;
width: 260px;
height: 130px;
padding: 10px 0 0 0;
font-size: 20px;
font-weight: 700;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color: #FFFFFF;
border-radius: 20px;
}
#redheader {
background-color : #C00;
width: 260px;
height: 130px;
padding: 10px 0 0 0;
font-size: 20px;
font-weight: 700;
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color: #FFFFFF;
border-radius: 20px;
}
#yellowheader {
background-color: #C93;
width : 260px;
height : 130px;
padding : 10px 0 0 0;
font-size : 20px;
font-weight : 700;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color : #FFFFFF;
border-radius : 20px;
}
#aquaheader {
background-color : #3CC;
width : 260px;
height : 130px;
padding : 10px 0 0 0;
font-size : 20px;
font-weight : 700;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color : #FFFFFF;
border-radius : 20px;
}
#magentaheader {
background-color : #F0F;
width : 260px;
height : 130px;
padding : 10px 0 0 0;
font-size : 20px;
font-weight : 700;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color : #FFFFFF;
border-radius : 20px;
}
#orangeheader {
background-color: #F60;
width : 260px;
height : 130px;
padding : 10px 0 0 0;
font-size : 20px;
font-weight : 700;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
color : #FFFFFF;
border-radius : 20px;
}
.tftextinput {
margin : 0;
padding : 5px 15px;
font-family : Arial, Helvetica, sans-serif;
font-size : 14px;
border : #0076a3 solid 1px;
border-radius : 5px;
}
.tftselect {
margin : 0;
color: black;
padding : 5px 15px;
width : 182px;
height : 28px;
font-family : Arial, Helvetica, sans-serif;
font-size : 14px;
border : #0076a3 solid 1px;
border-radius : 5px;
}
.tfbutton {
margin : 0;
padding : 5px 15px;
font-family : Arial, Helvetica, sans-serif;
font-size : 14px;
outline : none;
cursor : pointer;
text-align : center;
text-decoration : none;
color : #ffffff;
border : #0076a3 solid 1px;
background : #0095cd;
border-radius : 5px;
}
.tfbutton:hover {
text-decoration : none;
background : #007ead;
}
#tfnewsearch4 {
float : left;
padding : 0;
}
.tftextinput4 {
margin : 0;
padding : 6px 15px;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
font-size : 14px;
color : #000;
border : #0076a3 solid 1px;
border-radius : 5px;
}
.tfbutton4 {
margin : 0;
padding : 0;
width : 30px;
height : 30px;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
font-size : 18px;
font-weight : bold;
outline : none;
cursor : pointer;
text-align : center;
text-decoration : none;
color : #ffffff;
background : url('../../images/search-ico.png');
}
.tfbutton4::-moz-focus-inner {
border : 0;
}
.tfclear {
clear : both;
}
table.backgrounder {
background-image : url(../../images/bg-2.png);
background-repeat : no-repeat;
}
.selector {
position : absolute;
left : 50%;
top : 50%;
width : 180px;
height : 180px;
margin-top : -70px;
margin-left : -70px;
z-index : 1000;
}
.selector, .selector button {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-weight : 500;
}
.selector button {
position : relative;
width : 100%;
height : 100%;
padding : 10px;
background : #FFFFFF;
border-radius : 50%;
border : 0;
color : #006699;
font-size : 20px;
cursor : pointer;
box-shadow : 0 3px 3px rgba(0, 0, 0, 0.1);
transition : all 0.1s;
}
.selector button:hover {
background : #A6C7E0;
}
.selector button:focus {
outline : none;
}
.selector ul {
position : absolute;
list-style : none;
padding : 0;
margin : 0;
top : -20px;
right : -20px;
bottom : -20px;
left : -20px;
}
.selector li {
position : absolute;
width : 0;
height : 100%;
margin : 0 50%;
transition : all 0.8s ease-in-out;
}
.selector li input {
display : none;
}
.selector li input + label {
position : absolute;
left : 50%;
bottom : 100%;
width : 0;
height : 0;
line-height : 1px;
margin-left : 0;
background : rgba(166, 199, 224, 0.5);
border-radius : 50%;
text-align : center;
font-size : 1px;
overflow : hidden;
cursor : pointer;
box-shadow : none;
transition : all 0.8s ease-in-out, color 0.1s, background 0.1s;
}
.selector li input + label:hover {
background : #A6C7E0;
}
.selector li input:checked + label {
background : #A6C7E0;
color : white;
}
.selector li input:checked + label:hover {
background : #FF0000;
}
.selector.open li input + label {
width : 120px;
height : 120px;
line-height : 120px;
margin-left : -120px;
box-shadow : 0 3px 3px rgba(0, 0, 0, 0.1);
font-size : 12px;
}
.tbg {
position : relative;
width : 100%;
height : 100%;
margin : 0 auto;
min-height : 520px;
}
#centeredmenu {
float : left;
width : 100%;
padding-top : 18px;
background : #A6C7E0;
overflow : hidden;
position : relative;
}
#centeredmenu ul {
clear : left;
float : left;
list-style : none;
margin : 0;
padding : 0;
position : relative;
left : 50%;
text-align : center;
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica;
font-size : 12px;
font-weight : 700;
text-shadow : 1px 1px 1px #000;
}
#centeredmenu ul li {
display : block;
float : left;
list-style : none;
margin : 0;
padding : 0 2px 0 2px;
position : relative;
right : 50%;
}
@media only screen and (max-width:768px) {
#centeredmenu ul li {
padding : 0 1px 0 1px;
}
}
#centeredmenu ul li a {
display : block;
margin : 0 0 0 1px;
padding : 3px 8px;
background : #006699;
color : #FFF;
text-decoration : none;
line-height : 1.3em;
border-radius : 10px 10px 0 0;
height : 36px;
min-width : 65px;
}
@media only screen and (max-width:768px) {
#centeredmenu ul li a {
padding : 2px 5px;
font-size : 10px;
text-shadow : 1px 1px 1px #000;
height : 28px;
min-width : 52px;
}
}
#centeredmenu ul li a:hover {
background : #C00;
color : #fff;
}
#centeredmenu ul li a.active, #centeredmenu ul li a.active:hover {
color : #fff;
background : #C00;
}
#centeredmenu ul li.cat1 a {
background : #4166f5;
}
#centeredmenu ul li.cat1 a:hover {
background : #C00;
}
#centeredmenu ul li.cat1 a.active, #centeredmenu ul li.cat1 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat2 a {
background : #ff6600;
}
#centeredmenu ul li.cat2 a:hover {
background : #C00;
}
#centeredmenu ul li.cat2 a.active, #centeredmenu ul li.cat2 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat3 a {
background : #62B720;
}
#centeredmenu ul li.cat3 a:hover {
background : #C00;
}
#centeredmenu ul li.cat3 a.active, #centeredmenu ul li.cat3 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat4 a {
background : #9933ff;
}
#centeredmenu ul li.cat4 a:hover {
background : #C00;
}
#centeredmenu ul li.cat4 a.active, #centeredmenu ul li.cat4 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat5 a {
background : #AE264F;
}
#centeredmenu ul li.cat5 a:hover {
background : #C00;
}
#centeredmenu ul li.cat5 a.active, #centeredmenu ul li.cat5 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat6 a {
background : #CC9933;
}
#centeredmenu ul li.cat6 a:hover {
background : #C00;
}
#centeredmenu ul li.cat6 a.active, #centeredmenu ul li.cat6 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat7 a {
background : #33cccc;
}
#centeredmenu ul li.cat7 a:hover {
background : #C00;
}
#centeredmenu ul li.cat7 a.active, #centeredmenu ul li.cat7 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat8 a {
background : #009900;
}
#centeredmenu ul li.cat8 a:hover {
background : #C00;
}
#centeredmenu ul li.cat8 a.active, #centeredmenu ul li.cat8 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat9 a {
background : #ff00ff;
}
#centeredmenu ul li.cat9 a:hover {
background : #C00;
}
#centeredmenu ul li.cat9 a.active, #centeredmenu ul li.cat9 a.active:hover {
background : #C00;
}
#centeredmenu ul li.cat10 a {
background : #006699;
}
#centeredmenu ul li.cat10 a:hover {
background : #C00;
}
#centeredmenu ul li.cat10 a.active, #centeredmenu ul li.cat10 a.active:hover {
background : #C00;
}
.TTheader {
padding : 20px;
width : 90%;
margin : auto;
}
.TTheader img {
padding-right : 10px;
padding-left : 10px;
margin : auto;
}
.TT_text {
font-size : 18px;
color : #069;
}
.TT_textBold {
font-size : 18px;
color : #069;
font-weight : bold;
}
.TT_textOrangeTitle {
font-size : 24px;
color : #ff6600;
font-weight : bold;
}
.TT_title {
font-size : 36px;
color : #069;
font-weight : bold;
padding-top : 10px;
padding-left : 10px;
vertical-align : middle;
}
.TT_Subtitle {
font-size : 24px;
color : #ff6600;
font-weight : bold;
}
.TT_formText {
color : #ff6600;
font-weight : bold;
}
.btnLogin {
font-size : 14px;
font-weight : bold;
cursor : pointer;
color : #000000;
background-color : #ff6600;
background-image : url("../../images/btn_login.png");
border : 0;
height : 36px;
width : 125px;
}
.btn_blue {
border : 0;
background : #4166f5;
width : 127px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #FFF;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
cursor : pointer;
}
.btn_blue a {
color : #FFF;
text-decoration : none;
display : inline-block;
}
.btn_orange {
background : #ff6600;
border : 0;
width : 127px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #FFF;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
cursor : pointer;
}
.btn_orange a {
background : #ff6600;
color : #FFF;
text-decoration : none;
display : inline-block;
}
.btn_orangeTime {
background : #ff6600;
border : 0;
width : 50px;
border-radius : 6px;
font-size : 10px;
font-weight : bold;
color : #FFF;
text-align : center;
}
.btn_orangeTime a {
background : #ff6600;
color : #FFF;
}
.btn_AddNew {
border : 0;
width : 190px;
border-radius : 6px;
font-size : 16px;
font-weight : bold;
color : #0e659d;
text-align : center;
padding-top : 6px;
padding-right : 6px;
padding-bottom : 6px;
padding-left : 6px;
background-color : #FFF;
}
.btn_AddNew a {
background : #FFF;
color : #006699;
display : inline-block;
vertical-align : middle;
margin-top : 10px;
margin-bottom : 10px;
}
.btn_AddNew a:hover {
color : #ff6600;
}
.btn_AddNew img {
background : #FFF;
display : inline-block;
vertical-align : middle;
}
.holder {
padding-top : 12px;
padding-bottom : 12px;
}
.TTtableHd1 {
background-color : #a7c843;
font-size : 18px;
font-weight : bold;
padding : 6px;
}
.TTtableHd1sm {
font-size : 14px;
}
.TTtableHd2 {
background-color : #93ba41;
font-size : 18px;
font-weight : bold;
padding : 6px;
}
.TTtableHd2sm {
font-size : 14px;
}
.TTtablebg1 {
background-color : #c4def3;
}
.TTchartSm {
background-color : #e1edf7;
font-size : 12px;
color : #006699;
font-weight : bold;
}
.TTchartSm2 {
background-color : #006599;
font-size : 12px;
color : #fff;
font-weight : bold;
font-style : italic;
}
.TTchartSmBG {
background-color : #FFF;
font-size : 12px;
color : #006699;
font-weight : bold;
}
.TTtablebg2 {
background-color : #e1edf7;
}
.TTtablebgAdd {
background-color : #c4def3;
}
.TTtablebg0 a {
background-color : #c4def3;
color : #000;
text-decoration : underline;
}
.TTtablebg1 a {
background-color : #c4def3;
color : #000;
text-decoration : underline;
}
.TTtablebg2 a {
background-color : #e1edf7;
color : #000;
text-decoration : underline;
}
.TTtablebgAdd a {
color : #009900;
text-decoration : none;
font-size : 16px;
}
.TTtablebg0 td {
background-color : #c4def3;
padding : 5px;
font-weight : bold;
vertical-align : text-bottom;
font-size : 16px;
}
.TTtablebg0 img {
vertical-align : text-bottom;
}
.TTtablebg1 td {
background-color : #c4def3;
padding : 10px;
font-weight : bold;
}
.TTtablebg2 td {
background-color : #e1edf7;
padding : 10px;
font-weight : bold;
}
.TTtablebgAdd a {
color : #009900;
padding : 10px;
font-weight : bold;
}
.HistoryBar {
height : 10px;
width : 102px;
border : #a6c7e0 solid 1px;
text-align : left;
padding : 0;
}
.statsNumbers {
font-weight : bold;
color : #069;
text-align : center;
}
.statsNumbersRow1 {
font-weight : bold;
color : #069;
text-align : left;
background-color : #E1EDF7;
font-size : 16px;
padding-left : 10px;
padding-right : 10px;
}
.statsNumbersRow1Log {
font-weight : bold;
color : #069;
text-align : left;
background-color : #E1EDF7;
font-size : 14px;
}
.statsNumbersRowCenter {
font-weight : bold;
color : #069;
text-align : center;
background-color : #E1EDF7;
font-size : 16px;
}
.IDRowCenter {
font-weight : bold;
color : #069;
text-align : left;
background-color : #E1EDF7;
font-size : 16px;
text-decoration : underline;
overflow : scroll;
height : 60px;
}
.statsHeaderQuiz {
font-weight : bold;
color : #FFF;
text-align : center;
background-color : #006599;
font-size : 18px;
padding-top : 6px;
padding-bottom : 6px;
padding-left : 6px;
padding-right : 6px;
margin-left : 6px;
margin-right : 6px;
}
.statsHeaderQuiz span {
font-size : 13px;
padding-left : 2%;
padding-right : 2%;
}
.statsHeader1 {
font-weight : bold;
color : #FFF;
text-align : left;
background-color : #006599;
font-size : 18px;
padding-top : 6px;
padding-bottom : 6px;
}
.statsNumbersRow2 {
font-weight : bold;
color : #069;
text-align : left;
background-color : #c4def3;
font-size : 16px;
padding-left : 10px;
padding-right : 10px;
}
.statsNumbersRow1 img {
display : inline-block;
vertical-align : bottom;
}
.statsNumbersRow2Center {
font-weight : bold;
color : #069;
text-align : center;
background-color : #c4def3;
font-size : 18px;
}
.statsNumbersRow1 a {
text-decoration : underline;
}
.statsTotal {
font-weight : bold;
color : #ff6600;
text-align : left;
background-color : #c4def3;
font-size : 18px;
}
.statsTotalCenter {
font-weight : bold;
color : #ff6600;
text-align : center;
background-color : #c4def3;
font-size : 18px;
}
.statsTotal a {
color : #ff6600;
text-decoration : underline;
}
.statsText {
font-weight : bold;
font-size : 16px;
color : #ff6600;
}
.quizImage {
height : 70px;
width : 70px;
display : block;
}
.HistoryBar img {
height : 10px;
}
#contentNoScroll {
display : inline-block;
}
#contentNoScroll img.bookcover {
padding-top : 16px;
padding-right : 10px;
padding-bottom : 2px;
padding-left : 10px;
}
.levelUser {
font-size : 20px;
font-weight : bold;
color : #069;
position : relative;
display : block;
float : right;
}
.levelHeader {
font-size : 24px;
font-weight : bold;
color : #069;
}
.statsHeaderQuiz img {
display : inline-block;
padding-left : 6px;
vertical-align : bottom;
}
.textOrange {
font-weight : bold;
color : #ff6600;
}
.roundedTop {
padding : 10px;
background : #006599;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
font-weight : bold;
color : #FFF;
text-align : center;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedTopR {
padding : 10px;
background : #006599;
border-top-right-radius : 0.5em;
font-weight : bold;
color : #FFF;
text-align : center;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedTopL {
padding : 10px;
background : #006599;
border-top-left-radius : 0.5em;
font-weight : bold;
color : #FFF;
text-align : center;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedBtmR {
padding : 10px;
background : #e1edf7;
border-bottom-right-radius : 0.5em;
font-weight : bold;
color : #FFF;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedBtmL {
padding : 10px;
background : #e1edf7;
border-bottom-left-radius : 0.5em;
font-weight : bold;
color : #FFF;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedBtm {
padding : 10px;
background : #e1edf7;
border-bottom-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
vertical-align : top;
}
.roundedTop img {
display : inline-block;
padding-left : 6px;
padding-right : 6px;
vertical-align : bottom;
}
.statsNumbers select {
color : #006599;
font-weight : bold;
}
.ReadingEdit {
font-weight : bold;
border : #0c649c solid 1px;
padding : 4px;
}
.ReadingEditTime {
font-weight : bold;
border : #0c649c solid 1px;
padding : 4px;
text-align : center;
}
#tab1, #tab2, #tab3, #tab4, #tab5, #tab6, #tab7, #tab8 {
display : none;
}
#tab1:checked ~ .tabs #tab-content1, #tab2:checked ~ .tabs #tab-content2, #tab3:checked ~ .tabs #tab-content3, #tab4:checked ~ .tabs #tab-content4, #tab5:checked ~ .tabs #tab-content5, #tab6:checked ~ .tabs #tab-content6, #tab7:checked ~ .tabs #tab-content7, #tab8:checked ~ .tabs #tab-content8 {
display : block;
}
#tab1:checked ~ .tabs #label1, #tab2:checked ~ .tabs #label2, #tab3:checked ~ .tabs #label3, #tab4:checked ~ .tabs #label4, #tab5:checked ~ .tabs #label5, #tab6:checked ~ .tabs #label6, #tab7:checked ~ .tabs #label7, #tab8:checked ~ .tabs #label8 {
background : #0a629c;
color : #fff;
}
.tabs {
width : 650px;
float : none;
list-style : none;
margin : 30px auto;
}
.tabs li {
display : block;
}
.labels:after {
content : '';
display : table;
clear : both;
}
.tabs label {
display : inline-block;
float : left;
padding : 10px 20px;
color : #fff;
font-size : 14px;
font-weight : bold;
background : #fa6605;
cursor : pointer;
border-right-width : 4px;
border-right-style : solid;
border-right-color : #FFF;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
}
.tabs label:hover {
background : #a8c7e3;
color : #0e659d;
}
.tab-content {
display : none;
width : 100%;
padding : 0;
background-color : #ffffff;
}
.tabs input[type="radio"] {
display : none;
}
[id^="tab"]:checked ~ div[id^="tab-content"] {
display : block;
}
#relatedContent {
display : block;
clear : both;
max-width : 800px;
margin : 100px auto 0;
}
#relatedContent h3 {
font-size : 30px;
text-align : center;
color : #FFF;
}
#relatedContent .item {
max-width : 44%;
padding : 3%;
float : left;
text-align : center;
}
#relatedContent .item a img {
max-width : 100%;
}
#partnertab1, #partnertab2, #partnertab3, #partnertab4, #partnertab5, #partnertab6, #partnertab7, #partnertab8 {
display : none;
}
#partnertab1:checked ~ .tabs #partnertab-content1, #partnertab2:checked ~ .tabs #partnertab-content2, #partnertab3:checked ~ .tabs #partnertab-content3, #partnertab4:checked ~ .tabs #partnertab-content4, #partnertab5:checked ~ .tabs #partnertab-content5, #partnertab6:checked ~ .tabs #partnertab-content6, #partnertab7:checked ~ .tabs #partnertab-content7, #partnertab8:checked ~ .tabs #partnertab-content8 {
display : block;
}
#partnertab1:checked ~ .tabs #partnerlabel1, #partnertab2:checked ~ .tabs #partnerlabel2, #partnertab3:checked ~ .tabs #partnerlabel3, #partnertab4:checked ~ .tabs #partnerlabel4, #partnertab5:checked ~ .tabs #partnerlabel5, #partnertab6:checked ~ .tabs #partnerlabel6, #partnertab7:checked ~ .tabs #partnerlabel7, #partnertab8:checked ~ .tabs #partnerlabel8 {
background : #0a629c;
color : #fff;
}
.partnerlabels:after {
content : '';
display : table;
clear : both;
}
.partnertabs label {
display : inline-block;
float : left;
padding : 10px 20px;
color : #fff;
font-size : 14px;
font-weight : bold;
background : #fa6605;
cursor : pointer;
border-right-width : 4px;
border-right-style : solid;
border-right-color : #FFF;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
}
.partnertabs label:hover {
background : #a8c7e3;
color : #0e659d;
}
.partnertab-content {
display : none;
width : 100%;
padding : 0;
background-color : #ffffff;
}
.partnertabs input[type="radio"] {
display : none;
}
[id^="partnertab"]:checked ~ div[id^="partnertab-content"] {
display : block;
}
@media only screen and (max-width:768px) {
.TT_text, .TT_textBold, .btnLogin, .btn_blue, .btn_orange, .btn_orangeTime, .btn_AddNew, .TTtableHd1sm, .TTtableHd2sm, .TTchartSm, .TTchartSmBG, .TTtablebgAdd a, .TTtablebg0 td, .statsNumbersRow1, .statsNumbersRow1Log, .statsNumbersRowCenter, .statsNumbersRow2, .statsNumbersRow2Center, .statsText, .tabs label, .Quiztext, .Adminbtn_blue, .Adminbtn_orange, .adminText1, .Admin_btnSignOut, .statsHeaderQuiz span, .schoolsSelect {
font-size : 1em;
}
.TT_textOrangeTitle, .TT_title, .TT_Subtitle, .levelUser, .levelHeader, .roundedTop, .roundedTopR, .roundedBtmR, .statsTotal, .statsHeader1, .statsHeaderQuiz, .TTtableHd2, .TTtableHd1, .roundedTopQuiz, .schoolsHeader {
font-size : 1.2em;
}
#relatedContent h3, .Quiztitle, #searchQuizzes, .txtQuizSearch, .btnQuizSearch {
font-size : 1.2em;
}
}
.roundedTopQuiz {
padding : 10px;
background : #6500ff;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
font-weight : bold;
color : #FFF;
text-align : center;
font-size : 20px;
padding-top : 6px;
padding-bottom : 6px;
}
.roundedBtmQuiz {
padding : 10px;
background : #e1edf7;
border-bottom-right-radius : 0.5em;
border-bottom-left-radius : 0.5em;
font-weight : bold;
padding-top : 6px;
padding-bottom : 6px;
}
.Quiztitle {
font-size : 18px;
font-weight : bold;
color : #0c456b;
}
.Quiztitle img {
display : inline;
vertical-align : bottom;
border-top-style : none;
border-right-style : none;
border-bottom-style : none;
border-left-style : none;
}
.Quiztext {
font-size : 16px;
font-weight : bold;
color : #0f659d;
}
.col.span_1_third a img {
border-top-style : none;
border-right-style : none;
border-bottom-style : none;
border-left-style : none;
}
#searchQuizzes {
background-color : #a8c7e3;
padding : 6px;
font-size : 20px;
font-weight : bold;
color : #025e98;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
border-bottom-left-radius : 0.5em;
}
.txtQuizSearch {
color : #006599;
border : #006599 solid 1px;
font-size : 18px;
}
.btnQuizSearch {
font-weight : bold;
color : #0e659d;
background-color : #FFF;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
border-bottom-left-radius : 0.5em;
font-size : 18px;
}
#searchQuizzes input {
border : #006599 solid 1px;
font-weight : bold;
color : #0e659d;
background-color : #FFF;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
border-bottom-left-radius : 0.5em;
font-size : 18px;
}
.sectionCenter {
clear : both;
padding : 0;
margin : 0;
width : 90%;
background : #FFF;
text-align : center;
}
.Adminbtn_blue {
border : 0;
background : #1d82b4;
width : 200px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #FFF;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
}
.Adminbtn_blue a {
color : #FFF;
}
.Adminbtn_orange {
background : #ff6600;
border : 0;
width : 200px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #FFF;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
}
.Adminbtn_orange a {
background : #ff6600;
color : #FFF;
}
.AdminBar_orange {
background : #e1edf7;
color : #0e659d;
font-weight : bold;
padding-left : 10px;
padding-right : 10px;
text-align : left;
border-top-width : 2px;
border-top-style : solid;
border-top-color : #FA6605;
padding-top : 6px;
padding-bottom : 6px;
}
.adminText1 {
font-weight : bold;
color : #000;
font-size : 16px;
font-style : italic;
}
.Admin_btnSignOut {
font-weight : bold;
color : #0e659d;
background-color : #a8c7e3;
font-size : 16px;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
border-bottom-left-radius : 0.5em;
float : right;
padding-top : 6px;
padding-right : 10px;
padding-bottom : 6px;
padding-left : 10px;
}
.Admin_btnSignOut a:hover {
color : #ff6600;
}
.Admin_btnSignOut a:visited {
color : #0e659d;
background-color : #a8c7e3;
}
.statsHeaderQuiz span {
font-size : 14px;
font-weight : bold;
}
.orangeText {
color : #fa6604;
}
.schoolsSelect {
font-size : 16px;
font-weight : bold;
color : #006599;
}
.schoolsHeader {
font-size : 24px;
font-weight : bold;
padding : 0;
color : #006599;
}
.BlackText {
font-weight : bold;
font-size : 16px;
color : #000;
}
.BlackText a {
font-size : 16px;
color : #000;
text-decoration : underline;
}
.BlackText a img {
border-top-style : none;
border-right-style : none;
border-bottom-style : none;
border-left-style : none;
display : inline;
vertical-align : baseline;
padding-right : 6px;
padding-left : 6px;
}
.sectionMarket {
clear : both;
margin : 0;
background : #FFF;
text-align : left;
padding-top : 0;
padding-right : 0;
padding-bottom : 0;
padding-left : 20px;
}
.sectionMarket h1 {
font-size : 24px;
color : #006699;
padding-top : 2px;
padding-bottom : 4px;
}
.sectionMarket a {
font-weight : bold;
text-align : center;
color : #000;
}
.marketingIcons {
padding-right : 10px;
padding-left : 10px;
}
.btn_Marketblue {
border : 0;
background : #a8c7e3;
width : 75px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #0e659d;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
}
.btn_Marketblue a {
color : #0e659d;
}
.sectionpage table tr td table tr td h2 a {
text-decoration : underline;
}
.sectionpage table tr td table tr td h2 a:hover {
color : #fa6605;
}
.statsNumbersRowCenter label {
background-color : #E1EDF7;
color : #000;
padding : 0;
border-radius : 0;
border-top-style : none;
border-right-style : none;
border-bottom-style : none;
border-left-style : none;
}
.form-group li label {
background-color : #FFF;
padding : 0;
color : #000;
}
.form-group label:hover {
background-color : #e1edf7;
padding : 0;
color : #000;
border-radius : 0;
}
.AssignBk {
height : 70px;
width : 70px;
}
.modal-body tr td {
padding : 2px;
}
.studentId {
height : 90px;
width : 100%;
}
#classId {
background-color : #E1EDF7;
}
#studentId {
background-color : #E1EDF7;
font-weight : bold;
color : #069;
text-align : right;
font-size : 16px;
}
#Type {
background-color : #E1EDF7;
font-weight : bold;
color : #069;
text-align : right;
font-size : 16px;
}
div.scrollable {
width : 100%;
height : 90px;
max-height : 90px;
margin : 0;
overflow : auto;
padding-top : 0;
padding-right : 4px;
padding-bottom : 0;
padding-left : 0;
}
.scrollable hr {
background-color : #9acbf3;
height : 1px;
margin-top : 0;
margin-bottom : 0;
width : 100%;
border-width : 0;
color : #006699;
}
#studentId label {
float : left;
clear : both;
display : inline-block;
font-size : 14px;
padding-left : 4px;
}
#Type label {
float : left;
clear : both;
display : inline-block;
font-size : 14px;
padding-left : 4px;
}
.type hr {
background-color : #9acbf3;
height : 1px;
margin-top : 0;
margin-bottom : 0;
width : 100%;
border-width : 0;
color : #006699;
}
.modalTop {
background : #006599;
border-top-right-radius : 0.5em;
border-top-left-radius : 0.5em;
font-weight : bold;
color : #FFF;
text-align : center;
font-size : 14px;
padding-top : 6px;
padding-bottom : 6px;
}
.assignComplete {
font-weight : bold;
color : #5894bc;
text-align : left;
background-color : #e1edf7;
font-size : 16px;
}
.assignComplete a {
color : #5894bc;
}
.assignMessage {
font-weight: bold;
color: #5894bc;
text-align: left;
background-color: #e1edf7;
font-size: 16px;
padding: 10px;
border-left: solid
}
.assignunComplete {
font-weight : bold;
color : #0e659d;
text-align : left;
background-color : #e1edf7;
font-size : 16px;
}

.assignunComplete a {
color : #0e659d;
}
.assignHR {
background-color : #E1EDF7;
padding : 0;
margin : 0;
height : 2px;
text-align : center;
}
.assignHR hr {
background-color : #a5c6e0;
padding : 0;
height : 1px;
width : 100%;
border-width : 0;
color : #006699;
margin : 0;
}
#datepicker {
text-align : center;
}
table.chkboxList tr td {
width : 156px;
text-align : right;
border-bottom : 1px solid #9acbf3;
}
.bkDetails {
background-color : #c4def3;
border-bottom-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
}
.bkDetails1 {
background-color : #e1edf7;
border-bottom-left-radius : 0.5em;
border-bottom-right-radius : 0.5em;
}
.bkDetKeywords {
font-style : italic;
font-weight : bold;
color : #0c466b;
}
#bkDetSummary {
padding-right : 6px;
padding-left : 6px;
}
#bkDetDetails {
padding-right : 6px;
padding-left : 6px;
width : 180px;
}
#bkDetCol1 {
padding-right : 6px;
padding-left : 6px;
}
.btn_assign {
background : #fff;
border : 0;
width : 127px;
border-radius : 6px;
font-size : 14px;
font-weight : bold;
color : #0c466b;
text-align : center;
padding-top : 10px;
padding-right : 6px;
padding-bottom : 10px;
padding-left : 6px;
}
.btn_assign a {
background : #fff;
color : #006699;
}
.span_bookcoverQuiz {
width : 20%;
text-align : left;
margin : 0 0 0 0;
}
.quizHR hr {
margin-top : 0;
border : 0;
border-bottom : 1px solid #a7c8e1;
}
.aboutleft img {
float : left;
padding-left : 10px;
padding-bottom : 10px;
}
.aboutright {
text-align : left;
}
.aboutright img {
float : right;
padding-right : 10px;
padding-bottom : 10px;
}
.sectionfeature {
clear : both;
margin-left : auto;
margin-right : auto;
width : 80%;
background : #FFF;
}
.footer_admin {
display : inline-block;
text-align : center;
margin : 2px;
}
.col.span_footernav {
text-align : center;
display : inline-block;
}
.col.span_footernav a {
text-align : center;
margin-right : 10px;
}
hr {
border : 0;
height : 1px;
margin-top : 10px;
margin-bottom : 10px;
background-image : linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
.spacer {
margin-top : 20px;
margin-bottom : 20px;
}
blockquote {
border-radius : 15px;
font-style : italic;
color : #276394;
font-weight : bold;
background-color : #e1edf7;
border : #276394 solid 1px;
width : 80%;
padding : 20px;
display : block;
}
.bqFloatRt {
border-radius : 15px;
font-style : italic;
color : #276394;
font-weight : bold;
background-color : #e1edf7;
border : #276394 solid 1px;
width : 30%;
float : right;
clear : both;
padding-top : 20px;
padding-right : 40px;
padding-bottom : 20px;
padding-left : 40px;
margin-left : 20px;
margin-right : 20px;
}
.bqFloatLt {
border-radius : 15px;
font-style : italic;
color : #276394;
font-weight : bold;
background-color : #e1edf7;
border : #276394 solid 1px;
width : 30%;
float : left;
clear : both;
padding-top : 20px;
padding-right : 40px;
padding-bottom : 20px;
padding-left : 40px;
margin-left : 20px;
margin-right : 20px;
}
breadcrumb {
padding : 10px 16px;
list-style : none;
background-color : #e1edf7;
border : #006699 solid 1px;
}
ul.breadcrumb {
padding : 10px 16px;
list-style : none;
background-color : #e1edf7;
border : #006699 solid 1px;
}
ul.breadcrumb li {
display : inline;
font-size : 18px;
}
ul.breadcrumb li + li:before {
padding : 8px;
color : black;
content : "/\00a0";
}
ul.breadcrumb li a {
color : #006699;
font-weight : 700;
text-decoration : none;
}
ul.breadcrumb li a:hover {
color : #000000;
text-decoration : underline;
}
.pagination {
display : inline-block;
}
.pagination a {
color : black;
float : left;
padding : 8px 16px;
text-decoration : none;
background-color : white;
}
.pagination a:hover {
color : black;
float : left;
padding : 8px 16px;
text-decoration : none;
background-color : #0a68b3;
}
.pagination a.active {
background-color : #0a68b3;
color : white;
}
.pagination a:hover:not(.active) {
background-color : #ddd;
}
.pagination .arrows {
background-color : #ddd;
color : white;
}
.commoncore {
font-family : "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
border-collapse : collapse;
width : 100%;
}
.commoncore td, .commoncore th {
border : #ddd solid 1px;
padding : 8px;
}
.commoncore tr:nth-child(even) {
background-color : #f2f2f2;
}
.commoncore tr:hover {
background-color : #ddd;
}
.commoncore th {
padding-top : 12px;
padding-bottom : 12px;
text-align : left;
background-color : #A7C843;
color : white;
border : 0;
}
.commoncore th a {
padding-top : 12px;
padding-bottom : 12px;
text-align : left;
background-color : #A7C843;
color : white;
font-size : 14pt;
font-weight : 700;
}
.commoncore a {
color : #0fb1f2;
font-weight : 700;
padding : 5px 10px;
}
.commoncore a:hover {
color : black;
font-weight : 700;
}
.commoncore a:visited {
color : #0fb1f2;
font-weight : 700;
}
label {
display : none;
}

/* Stats Table Style */
.stats {
    font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}
.stats td, .stats th {
    border: 1px solid #0a68b3;
    padding: 5px;
}
.stats tr:nth-child(even) {background-color: #e6eff7;}
.stats tr:hover {background-color: #cee0ef;}
.stats th {
    padding: 5px;
	font-size: 14px;
    text-align: center;
    background-color: #0a68b3;
    color: white;
}
.stats a {
	font-weight: 700;
    color: #0fb1f2;
	text-decoration: underline;
}
.stats a:hover {
	font-weight: 700;
    color: #0a68b3;
	text-decoration: underline;
}

/* TEACHER PORTAL RESULTS */

.zero {
	display: none;
}
@media only screen and (max-width: 1024px)  {
.zero {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.zero {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.zero {
	padding: 5px 5px;
}
}
.one {
	background: crimson;
	padding: 5px 24px;
	color: #FFFFFF;
	font-weight: bold;
}
@media only screen and (max-width: 1024px)  {
.one {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.one {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.one {
	padding: 5px 5px;
}
}
.two {
	background: purple;
	padding: 5px 24px;
	color: #FFFFFF;
	font-weight: bold;
}
@media only screen and (max-width: 1024px)  {
.two {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.two {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.two {
	padding: 5px 5px;
}
}
.three {
	background: orange;
	padding: 5px 24px;
	color: #000000;
	font-weight: bold;
}
@media only screen and (max-width: 1024px)  {
.three {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.three {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.three {
	padding: 5px 5px;
}
}
.four {
	background: gold;
	padding: 5px 24px;
	color: #000000;
	font-weight: bold;
}
@media only screen and (max-width: 1024px)  {
.four {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.four {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.four {
	padding: 5px 5px;
}
}
.five {
	background: mediumseagreen;
	padding: 5px 24px;
	color: #000000;
	font-weight: bold;
}
@media only screen and (max-width: 1024px)  {
.five {
	padding: 5px 20px;
}
}
@media only screen and (max-width: 768px)  {
.five {
	padding: 5px 10px;
}
}
@media only screen and (max-width: 480px) {
.five {
	padding: 5px 5px;
}
}
/* Quiz Portal Table Style */
.quizportal {
    font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
	font-size: 1em;
	font-weight: 500;
    border-collapse: collapse;
    width: 100%;
	margin-bottom: 20px;
}
.commoncore th {
    border: 0px;
    padding: 8px;
}
.quizportal td {
    border: 1px solid #ddd;
    padding: 8px;
	width:20%;
}
.quizportal tr:nth-child(even){background-color: #f2f2f2;}
.quizportal tr:hover {background-color: #ddd;}
.quizportal th {
    padding-top: 12px;
    padding-bottom: 12px;
	font-size: 1em;
    text-align: center;
    background-color: #0a68b3;
    color: white;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}
.quizportal a {
    color: #0a68b3;
	font-weight: 700;
	padding: 5px 10px;
}
.quizportal a:hover {
    color: #000000;
	font-weight: 700;
}
.alert {
	position: fixed;
    top: 50%;
    left: 50%;
    width: 420px;
    line-height: normal;
    height: 200px;
    margin-left: -150px;
    margin-top: -100px;
  	z-index: 20;
    padding: 20px;
    background-color: #FFFFFF;
	font-size: 1.25em;
	font-weight: 700;
    color: #0a68b3;
	border: 2px solid #006699;
	box-shadow: 4px 8px 16px rgba(0, 0, 0, .5);
}

.closebtn {
    margin-left: 15px;
    color: #006699;
    font-weight: bold;
    float: right;
    font-size: 42px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

.closebtn:hover {
    color: black;
}


/* COOKIE CONSENT STYLES */
.cc-window{opacity:1;transition:opacity 1s ease}
.cc-window.cc-invisible{opacity:0}
.cc-animate.cc-revoke{transition:transform 1s ease}
.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}
.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}
.cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}
.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s; background-color: gold;}
.cc-link,.cc-revoke:hover{text-decoration:underline}
.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}
.cc-window.cc-static{position:static}
.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}
.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}
.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}
.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}
.cc-link:hover{opacity:1}
.cc-link:active,.cc-link:visited{color:initial}
.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}
.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}
.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}
.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}
.cc-close:focus,.cc-close:hover{opacity:1}
.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}
.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}
.cc-revoke.cc-left{left:3em;right:unset}
.cc-revoke.cc-right{right:3em;left:unset}
.cc-top{top:1em}
.cc-left{left:1em}
.cc-right{right:1em}
.cc-bottom{bottom:1em}
.cc-floating>.cc-link{margin-bottom:1em}
.cc-floating .cc-message{display:block;margin-bottom:1em}
.cc-window.cc-floating .cc-compliance{-ms-flex:1 0 auto;flex:1 0 auto}
.cc-window.cc-banner{-ms-flex-align:center;align-items:center}
.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}
.cc-banner .cc-message{display:block;-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;margin-right:1em}
.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}
.cc-floating .cc-compliance>.cc-btn{-ms-flex:1;flex:1}
.cc-btn+.cc-btn{margin-left:.5em}
@media print{.cc-revoke,.cc-window{display:none}}
@media screen and (max-width:900px){.cc-btn{white-space:normal}}
@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}
.cc-window.cc-bottom{bottom:0}
.cc-window.cc-banner,.cc-window.cc-floating,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}
.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}
.cc-window.cc-banner .cc-compliance{-ms-flex:1 1 auto;flex:1 1 auto}
.cc-window.cc-floating{max-width:none}
.cc-window .cc-message{margin-bottom:1em}
.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}
.cc-window.cc-banner .cc-message{margin-right:0}}
.cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}
.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}
.cc-theme-classic .cc-btn{border-radius:5px}.cc-theme-classic .cc-btn:last-child{min-width:140px}
.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}
.cc-theme-edgeless.cc-window{padding:0}.cc-floating.cc-theme-edgeless .cc-message{margin:2em 2em 1.5em}
.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}
.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}
.cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0}
.cc-btn {display: block;padding:.4em .8em;font-size: 1em;font-weight: 700;border-width: 2px;border-style: solid;text-align: center;white-space: nowrap;cursor: pointer;background-color: #A6C7E0;
}


/* Style all input fields */
.span_login input {
  width: 125px;
  padding: 4px;
  border: 1px solid #ccc;
  background-color: aliceblue;
  border-radius: 2px;
  box-sizing: border-box;
  margin-top: 0px;
  margin-bottom: 0px;
}

/* Style the submit button */
.span_login input[type=submit] {
  background-color: #006699;
  color: white;
}

/* Style the container for inputs */
span_login .container {
  background-color: #FFFFFF;
  padding: 5px;
  max-width: 200px;
}

/* The message box is shown when the user clicks on the password field */
#message {
  display:none;
  background: #f1f1f1;
  color: #000;
  position: relative;
  padding: 4px;
  margin-top: 2px;
}

#message p {
  padding: 5px 10px;
  font-size: 12px;
}

/* Add a green color text color and a checkmark when the requirements are right */
.valid {
  color: green;
}

.valid:before {
  position: relative;
  left: -35px;
  content: "\2713";
}

/* Add a red text color and an "x" when the requirements are wrong */
.invalid {
  color: red;
}

.invalid:before {
  position: relative;
  left: -35px;
  content: "\2715";
}

/* Assign Book Table Style */
.assign {
    font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
    border-collapse: collapse;
    width: 90%;
	margin: 10px;
}
.assign th {
	border: 0px;
    padding: 10px;
	font-size: 14px;
    text-align: center;
    background-color: #0a68b3;
    color: white;
}
.assign tr:nth-child(even) {
	background-color: #e6eff7;
}
.assign tr:nth-child(odd) {
	background-color: #FFFFFF;
}
.assign td {
    border: 0px;
    padding: 10px;
}

.assign p {
	font-weight: 500;
    color: #006699;
}

.assign a {
	font-weight: 700;
    color: #0fb1f2;
	text-decoration: underline;
}
.assign a:hover {
	font-weight: 700;
    color: #0a68b3;
	text-decoration: underline;
}

/* MyAssignments FAQs styles */

.faqs p { 
	margin-left: 1.5em;
	margin-right: 1.5em;
}

.faqs h1 { 
	font-size: 2em; 
}

.faqs h2 { 
	font-size: 1.5em; 
	font-weight: 700;
	color: #006699;
	border-bottom: 1px dashed #006699;
	line-height:2em; margin:10px 0 20px;
}


.lessonplan {
font-family: "Open Sans", "Open Sans Bold", Arial, "Arial Bold", Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
.lessonplan td {
padding: 8px;
}
.lessonplan tr:nth-child(even) {
background-color: #f2f2f2;
border-bottom: #6699ff solid 1px;
}
.lessonplan tr:nth-child(odd) {
background-color: #FFFFFF;
}
.lessonplan tr:hover {
background-colo: #f2f2f2;
}
.lessonplan a {
color: #0fb1f2;
font-weight: 700;
padding: 5px 10px;
}
.lessonplan a:hover {
color: black;
font-weight : 700;
}
.lessonplan a:visited {
color: #0fb1f2;
font-weight: 700;
}
.lessons td {
	background-color: #f2f2f2;
}

/* signup login styles */

.signuplogin{  
	width: 80%;
	overflow: hidden;
	margin: auto;
	margin: 20 0 0 10px;
	padding: 20px;
	background: #090;
	border-radius: 15px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);       
}  
.signuplogin h1{  
    text-align: center;  
    color: #ffffff;  
	letter-spacing: 2px;
}  
.signuplogin h2{  
    text-align: center;  
    color: #ffffff;
}  
.signuplogin label{  
    color: #08ffd1;  
    font-size: 1em;  
}  
.signupinput{  
    width: 90%;  
    height: 30px;  
    border: none;  
    border-radius: 3px;  
    padding-left: 8px;
	font-size: 1em;
} 

.signupsubmit{  
    width: 90%;  
    height: 30px;  
    border: none;  
    border-radius: 3px;  
    padding-left: 8px;  
    color: #006699;
	background: #e1edf7;
	font-size: 1em;
}  
.signuplogin span{  
    color: white;  
    font-size: 0.9em;  
}  
.signuplogin a{  
    float: right;  
    color: white;
	font-size: 0.9em;  
}


/* newsletter signup styles */

.newsletterlogin{ 
	width: 80%; 
	overflow: hidden;
	margin: auto;
	margin: 20 0 0 10px;
	padding: 20px;
	background: #006699;
	border-radius: 15px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);     
}  
.newsletterlogin h1{  
    text-align: center;  
    color: #ffffff;  
	letter-spacing: 2px;
}  
.newsletterlogin h2{  
    text-align: center;  
    color: #ffffff;
}  
.newsletterlogin label{  
    color: #08ffd1;  
    font-size: 1em;  
}  
.newsletterinput{  
    width: 90%;  
    height: 30px;  
    border: none;  
    border-radius: 3px;  
    padding-left: 8px;
	font-size: 1em;
} 

.newslettersubmit{  
    width: 90%;  
    height: 30px;  
    border: none;  
    border-radius: 3px;  
    padding-left: 8px;  
    color: #006699;
	background: #e1edf7;
	font-size: 1em;
}

.newsletterlogin span{  
    color: white;  
    font-size: 0.9em;  
}  
.newsletterlogin a{  
    float: right;  
    color: white;
	font-size: 0.9em;  
}

.btn-school { 
	width: 90%; 
	overflow: hidden;
	margin: auto;
	margin: 20 0 0 10px;
	padding: 20px;
	background: #ae254f;
	color: white;
	font-size: 1em;
	font-weight: 700;
	text-align: center;
	border-radius: 15px;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);     
}

.btn-newsletter { 
	width: 90%; 
	overflow: hidden;
	margin: auto;
	margin: 20 0 0 10px;
	padding: 20px;
	background: #cc9f2c;
	color: white;
	font-size: 1em;
	font-weight: 700;
	text-align: center;
	border-radius: 15px;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);     
}

.topbutton {
  width: 260px;
  background-color: #fffffff;
  border: 2px solid #006699;
  padding: 2px 10px;
  text-align: right;
  text-decoration: none;
  display: block;
  font-size: 12px;
  margin: 4px 2px;
  cursor: pointer;
}


.topbutton a {
  color: #006699;
  text-align: right;
  text-decoration: none;
}

.topbutton a:hover {
  color: red;
}
.selected {
  width: 260px;
  background-color: #e1edf7;
  border: 2px solid #006699;
  padding: 2px 10px;
  text-align: right;
  text-decoration: none;
  display: block;
  font-size: 12px;
  margin: 4px 2px;
  cursor: pointer;
}


.span_right {
width: 42.2%;
max-height: 120px;
float: right;
}