@import url('/sites/main/mediacommon/css/fonts/font_g02.css');

:root {
  --color_pagebg: #ffffff; /* main page bg color */
  --color_menubg: #F1F3EE; /* main page bg color */
  --color_border1: #dddddd; /* border and line colors for menubg */
  --color_linktext1: #2F4660; /* blue=004AAD, green=3B6A75 main link text color */
  --color_linktext2: #004AAD; /* blue=004AAD, green=3B6A75 main link text color */
  --color_boxbg1: #2F4660; /* bg color for boxes 1 */
  --color_boxbg1light: #3B6A95; /* bg color for boxes 1 */
  --color_boxtext1: #ffffff; /* text color for boxes 1 */
  --color_boxbg2: #eeeeee; /* bg color for boxes 2, generally light */
  --color_boxtext2: #111111; /* text color for boxes 2 */
  --color_boxbg3: #476B91; /* bg color for boxes 1 */
  --color_boxtext3: #ffffff; /* text color for boxes 2 */
}
.text-color1 { color: var(--color_linktext1) !important; }
.text-color2 { color: var(--color_linktext2) !important; }
.bg-color1 { background-color: var(--color_linktext1) !important; }
.bg-color2 { background-color: var(--color_linktext2) !important; }
.border-left1 { border-left: 2px solid var(--color_boxbg1); }

body {
    background-color: var(--color_pagebg);
    font-family: 'Manrope', sans-serif;
    /*font-family: 'Open Sans', sans-serif;*/
    font-size: 16px;
    line-height: 1.6;
}
@media (max-width: 767px) {
body { font-size: 16px; }
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: inherit; line-height: inherit; }
h1, .h1 { font-size: 28px; }
h2, .h2 { font-size: 24px; }
h3, .h3 { font-size: 20px; }
h4, .h4 { font-size: 16px; }
h1  { margin-top: 10px; }
a, a:link, a:visited { color: var(--color_linktext1); }

#site-logos {
    border-bottom: 1px solid var(--color_linktext1);
    margin-bottom: 15px;
}

.navbar-fixed-top .navbar-brand-main {
    color: var(--color_linktext1);
    text-shadow: 2px 2px 4px var(--color_linktext1);
    font-weight: 200;
    font-size: 1.6em !important;
}

.site-headertitle {
    color: var(--color_linktext1);
    text-shadow: 2px 2px 4px var(--color_linktext1);
    padding: 15px 0 20px 0;
    font-size: 2.1em;
    font-weight: 200;
}

.breadcrumb { background-color: var(--color_boxbg1); }
.breadcrumb, .breadcrumb a { color: var(--color_boxtext1); }
.breadcrumb>li+li:before, .breadcrumb>.active { color: #eeeeee; }

/*.navbar-default .navbar-brand,*/
.navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a {
    font-family: 'Manrope', sans-serif;
}
.navbar-default .navbar-nav>li>a {
    font-size: 1em;
}

/* Vertical paddings adjusted based on logo height */
body.notpublicpage  { padding-top: 85px; }
.notpublicpage .navbar-nav { margin-top: 10px; }
.notpublicpage .navbar-default .navbar-brand {
    padding: 14px 10px 7px 15px;
}
.notpublicpage .navbar-brand-main img {
    max-height: 46px;
    margin: 0px 0 5px 0;
}
@media (max-width: 991px) {
body.notpublicpage  { padding-top: 70px; }
/*.notpublicpage .navbar-nav { margin-top: 4px; }*/
.notpublicpage .navbar-default .navbar-brand { padding: 10px 10px 7px 15px; }
.notpublicpage .navbar-brand-main img { height: 36px; }
.notpublicpage .navbar-default .navbar-brand, .notpublicpage .navbar-default .navbar-nav>li>a { font-size: 0.95em; }
}
@media (max-width: 600px) {
.navbar-header .navbar-brand {
    font-size: 1.2em !important;
    padding-top: 5px;
    padding-bottom: 3px;
}
.notpublicpage.loggedout .navbar-brand-main img { height: 28px; margin-top: 6px; }
.notpublicpage.loggedout .navbar-default .navbar-brand, .notpublicpage.loggedout .navbar-default .navbar-nav>li>a { font-size: 0.9em; }
}
@media (max-width: 510px) { .notpublicpage.loggedout .navbar-brand-main img { display: none; } } /* simply too wide with logo and some languages... */
/* END: Vertical paddings */
@media (max-width: 767px) {
.notpublicpage .navbar-nav { margin-top: 0px; } /* for EXIT button */
}

@media (max-width: 600px) {
    #divMenu { text-align: center; }
}
.startmenu {
    display: inline-block;
    text-align: left;
}
.startmenu ul:first-child {
    margin-bottom: 0;
}
.startmenu .list-group-item ul {
    padding-bottom: 7px;
}
.startmenu .list-group-item {
    background-color: var(--color_boxbg1);
    font-size: 1.25em;
    border: 0;
    padding: 0;
    margin-bottom: 7px;
    border-radius: 25px;
}
.startmenu .list-group-item a{
    display: block;
    padding: 10px 15px 10px 15px;
    border-radius: 24px;
    white-space: nowrap;
    color: var(--color_boxtext1);
}
.startmenu .list-group-item li a{
    border-radius: 12px;
}
.startmenu .list-group-item a:hover {
    background-color: var(--color_boxbg1light);
    text-decoration: none;
}

#nav-program .menu-item a {
    background: transparent;
    border: 0;
    border-color: transparent;
    box-shadow: 0 7px 5px -4px rgba(110, 150, 150, 0.75);
    font-size: 0.9em;
    padding: 8px;
    margin-bottom: 10px;
    margin-left: 10px;
    color: #555555;
}
#nav-program .menu-item a:hover {
    background-color: var(--color_boxbg1light);
    color: var(--color_boxtext1);
}
#nav-program .menu-active a {
    font-style: normal;
    background-color: var(--color_boxbg1);
    color: var(--color_boxtext1);
}
#nav-program .menu-item a .glyphicon {
    color: var(--color_boxtext1);
}

/*.panel-body>h3 { font-size: 15px; font-weight: bold; }*/

.btn-primary {
color: var(--color_boxtext1) !important;
background-color: var(--color_boxbg1);
border-color: var(--color_boxbg1);
}

.programtext {
	font-size: 17px;
	line-height: 1.7;
}
@media (min-width: 992px) {
.programtext {
	padding-left: 40px;
	padding-right: 50px;
}
.programtext /*p, .programtext div, .programtext td, .programtext li*/{
	font-size: 17px;
}
}
@media (max-width: 600px) {
.programtext /*p, .programtext div, .programtext td, .programtext li*/{
	font-size: 16px;
	line-height: 1.8;
}
}

.worksheet-table1, .worksheet-table1 td{
    border: 1px solid #888888 !important;
}
.worksheet-header2, .worksheet-side2{
    background-color: #e0e0e0;
    color: #000000;
}
@media screen {
.worksheet-header1, .worksheet-side1{
    background-color: var(--color_boxbg1);
    color: var(--color_boxtext1);
}
}
.worksheet-ratestar {
    color: var(--color_boxbg1);
    font-size: 2.5em;
    cursor: pointer;
}
.programtext iframe {
    border: 1px solid #888888;
}
.programtext img {
    border-radius: 7px;
}

.worksheet-posts .panel {
    background-color: transparent;
}

.programtext .worksheet-title, .worksheet-posts .postHide, .programtext .postHideProgram, .programtext .wsAnswerHeaderText1 { display: none; }
.postShow, .programtext .postShowProgram{ display: none; }
.worksheet-posts .postShow, .programtext .worksheet-posts .postShowProgram{ display: initial; }

img.stars1 {
    width: 196px !important;
    height: auto !important;
}

.programtext table ul {
    padding-left: 17px;
    margin-bottom: 0;
}


audio {
    width: 100%;
    max-width: 400px;
}

.expandLink {
    font-weight: bold;
    cursor: pointer;
    /*padding-bottom: 10px;*/
}
.expandLink:before {
   content: "» ";
}
.expandLink:hover {
    color: var(--color_menubg2);
}
.expandText {
    padding: 0 0 15px 30px;
    /*display: none;*/
}
.cke_editable .expandText {
    display: block;
}

.emphasizeMore {
    font-size: 1.3em;
    color: #02a312;
}

.videoContainer { display: none; }
.videoContainerNoJs {
    text-align: center;
    font-style: italic;
}

.box1, .box2, .box3 {
    margin-left: auto;
    margin-right: auto;
    padding: 15px 10px 15px 15px;
    border-radius: 20px;
    border: 1px solid #aaaaaa;
    /*box-shadow: 7px 7px 5px 0px rgba(150, 170, 170, 0.75);*/
    max-width: 100%;
}
@media (min-width: 768px) { .box1, ._box2, .box3 { width: 80%; } }
.box1 { background-color: var(--color_boxbg1); }
.box2 { background-color: var(--color_boxbg3); }
.box3 { border: 2px solid #555555; border-radius: 20px; }
.box1, .box1 p, .box1 span, .box1 div, .box1 h1, .box1 h2, .box1 h3, .box1 h4,
.box2, .box2 p, .box2 span, .box2 div, .box2 h1, .box2 h2, .box2 h3, .box2 h4 
 { color: var(--color_boxtext1); }
.box3, .box3 p, .box3 span, .box3 div, .box3 h1, .box3 h2, .box3 h3, .box3 h4 
 { color: var(--color_boxtext3); } /* #588157; */
.box1 h1, .box1 h2, .box1 h3, .box1 h4,
.box2 h1, .box2 h2, .box2 h3, .box2 h4,
.box3 h1, .box3 h2, .box3 h3, .box3 h4
 { margin-top: 5px; }


.table1 { margin: auto; }
@media (min-width: 768px) { .table1 { width: 90%; } }
.table1 tr:first-child { background-color: var(--color_boxbg1); color:  var(--color_boxtext1); text-align: center; font-weight: normal !important; }
.table1 td { padding: 5px 8px 5px 8px; }

.audioDiv1 { display: none; margin-bottom: 1.5em; }
