@font-face {
    font-family: "FranklinGothicBook";
    src: url("../fonts/franklingothic-book-webfont.woff") format("woff");
}

@font-face {
    font-family: "FranklinGothicDemi";
    src: url("../fonts/franklingothic-demi-webfont.woff") format("woff");
}

@font-face {
    font-family: "FranklinGothicDemiItalic";
    src: url("../fonts/franklingothic-demiit-webfont.woff") format("woff");
}

@font-face {
	font-family: "Alegreya";
	src: url("../fonts/Alegreya-Regular.woff") format("woff");
}

.pageTitle {
	font-family: 'Alegreya';
	font-size: 39pt;
	color: #2C3B86;
	padding-left: 5%;
	padding-top:10pt;
	padding-bottom:0pt;
}

.pageTitleSubtext {
	font-family: 'FranklinGothicDemi';
	font-size: 16pt;
	color: #010101;
	padding-left: 10%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.pageContent {
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14pt;
	color: #010101;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.pageQuote {
	border-left: 2pt solid #7B84B3;
	font-family: 'FranklinGothicDemiItalic';
	font-size: 14pt;
	line-height: 18pt;
	color: #2C3B86;
	padding-left: 10pt;
	padding-top:10pt;
	padding-bottom:10pt;
	margin: 0px;
}

.pageQuote2 {
	border-left: 2pt solid #7B84B3;
	font-family: 'FranklinGothicDemi';
	font-size: 14pt;
	line-height: 18pt;
	color: #010101;
	padding-left: 10pt;
	padding-top:10pt;
	padding-bottom:10pt;
	margin: 0px;
}

.pageMission {
	font-family: 'FranklinGothicDemi';
	font-size: 16pt;
	line-height: 20pt;
	color: #2C3B86;
	padding-left: 10%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.pageActivityBriefing {
	font-family: 'FranklinGothicBook';
	font-size: 14pt;
	line-height: 18pt;
	color: #010101;
	padding-top:10pt;
	padding-bottom:10pt;
	margin: 0px;
}

.activityButton {
	display: block;
	color: white;
	background-color: #465495;
	text-align:center;
	text-decoration:none;
	font-family: 'FranklinGothicDemi';
	font-size: 12pt;
	line-height: 13pt;
	padding:5pt;
}

.activitySubtext {
	font-family: 'FranklinGothicDemi';
	font-size: 16pt;
	line-height: 20pt;
	color: #2C3B86;
	padding-left: 5%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.activityList {
	font-family: 'FranklinGothicDemi';
	font-size: 14pt;
	line-height: 18pt;
	color: #2C3B86;
	padding-left: 5%;
	padding-top: 10pt;
}

.welcome {
	font-family: 'FranklinGothicBook';
}

.missionLink:link{
	color: #3373BC;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLink:visited {
	color: #3373BC;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLink:hover {
	color: #46D7F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLink:active {
	color: #B546F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkActive:link{
	color: #B546F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkActive:visited{
	color: #B546F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkActive:hover {
	color: #46D7F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkActive:active {
	color: #3373BC;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.activityTitle {
	font-size: 29pt;
	font-family: 'Alegreya';
	color: #010101;
	padding-left: 5%;
	padding-top: 10pt;
	padding-bottom: 10px;
	line-height:1;
}

.activityTitle2 {
	font-size: 29pt;
	font-family: 'Alegreya';
	color: #2C3B86;
	padding-left: 0%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.activityListDirections {
	font-family: 'FranklinGothicBook';
	font-size: 14pt;
	line-height: 18pt;
	color: #2C3B86;
	padding-left: 5%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

.activityListBlack {
	font-family: 'FranklinGothicDemi';
	font-size: 14pt;
	line-height: 18pt;
	color: #010101;
	padding-left: 5%;
	padding-top: 10pt;
	padding-bottom: 10pt;
}

hr {
	height: 1pt;
	border-top: 1pt solid  #A1A1A1;
	background-color: #A1A1A1;
}

.activityContent {
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14pt;
	color: #010101;
	padding-top: 10pt;
	padding-bottom: 10pt;
	padding-left:5%;
}

.activityContentTitle{
	font-family: 'FranklinGothicDemi';
	font-size: 16pt;
	line-height: 20pt;
	color: #2C3B86;
	padding-top: 10pt;
	padding-bottom: 10pt;
	padding-left:5%;
}

.activityDirections{
	font-family: 'FranklinGothicDemiItalic';
	font-size: 14pt;
	line-height: 18pt;
	color: #2C3B86;
	padding-top: 10pt;
	padding-bottom: 10pt;
	margin-left:25%;
	padding-left: 2%;
	border-left: 2pt solid #7B84B3;
}

.activityDirectionsSubtext{
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14pt;
	color: #2C3B86;
	padding-top: 10pt;
	padding-bottom: 10pt;
	padding-left: 27%;
}

.activityBox{
	width: 90%;
	border: 1pt solid #C5D7EC;
	float: right;
	background-color: #E2EBF5;
}

.answerBox {
	overflow-y: scroll;
	padding:10pt;
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height:14pt;
	color: #010101;
	background-color: #E2EBF5;
	border: none;
}

.scrollbar-measure {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}

.activityButton {
	float:right;
	background-color: #2C3B86;
	color: white;
	font-family: "FranklinGothicDemi";
	font-size: 13pt;
	border:none;
	margin-right: 15pt;
	margin-top: 15pt;
	margin-bottom:15pt;
	cursor: pointer;
}

.buffer {
	width:30%;
	height: 10%;
}

.caption {
	width:60%;
	font-family:'FranklinGothicBook';
	font-size:10pt;
	line-height: 12pt;
	color:#2C3B86;
	margin-right: 10pt;
	text-align: right;
}

.img {
	width:60%;
}

.topButtonBar {
	background-color: #465495;
	overflow-y:auto;
	overflow-x: hidden;
	padding:10pt;
	padding-top: 10pt;
	clear: both;
}

.nextActivityLink {
	padding-top: 10pt;
	padding-bottom: 10pt;
	text-align:right;
	float:right;
	font-family: 'FranklinGothicDemi';
	font-size: 16pt;
	color: #010101;
	text-decoration: none;
	cursor: pointer;
}

.activityListBlack ul li {
	color: #3373BC;
	padding: 3pt;
}

.activityList ul li {
	color: #3373BC;
	padding: 3pt;
}

.messageOverlay {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	background-color: rgba(44, 59, 134, 0.75);
}

.messageWindow{
	width: 80%;
	height:80%;
	position:absolute;
	top: 10%;
	right:10%;
	background-color: white;
}

.messageBox {
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14pt;
	color: #010101;
	padding:5pt;
	border-radius: 5pt;
}

.aLinkTwo:link{
	color: #010101;
	text-decoration:none;
}

.aLinkTwo:visited {
	color: #010101;
	text-decoration:none;
}

.aLinkTwo:hover {
	color: #46D7F1;
	text-decoration:none;
}

.aLinkTwo:active {
	color: #B546F1;
	text-decoration:none;
}

.libraryLink:link{
	color: #010101;
	text-decoration:none;
}

.libraryLink:visited {
	color: #010101;
	text-decoration:none;
}

.libraryLink:hover {
	color: blue;
	text-decoration:none;
}

.libraryLink:active {
	color: #B546F1;
	text-decoration:none;
}

.messageBoxNoHover {
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14pt;
	color: #010101;
	padding:5pt;
	border-radius: 5pt;
	border: 2px solid rgb(226, 235, 245);
}

.messageBox:hover {
	border: 2px solid #2C3B86;
}

.mission{
	color: #2C3B86;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
	font-size: 14pt;
	line-height: 20pt;
}

.spacer {
	height:20pt;
}

.smallSubtext{
	color: #010101;
	font-family: 'FranklinGothicBook';
	font-size: 10pt;
}

.memberBenefits{
	font-family: 'FranklinGothicBook';
	font-size: 14pt;
	line-height: 18pt;
	color: #2C3B86;
	background-color: #E2EBF5;
}

.profileDataBox{
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14.5pt;
	color: #010101;
	background-color: rgb(222, 232, 243);
}

.profileDataBoxSub{
	font-family: 'FranklinGothicBook';
	font-size: 12pt;
	line-height: 14.5pt;
	color: #010101;
	background-color: rgb(234, 240, 247);
}

li.memberBenefits{
	padding:2pt;
}

.submitButton{
	background-color: #2C3B86;
	color: white;
	font-family: "FranklinGothicDemi";
	font-size: 13pt;
	border:none;
	margin-right: 15pt;
	margin-top: 15pt;
	margin-bottom:15pt;
	cursor: pointer;
}

.videoBlock{
	width:250px;
	margin:10pt;
	text-align: center;
}

.videoBlock a{
	text-decoration: none;
	color:#010101;
	font-family:'FranklinGothicDemi';
	font-size:14pt;
}

 /* Style the tab */
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
	width:90%;
	margin-left:5%;
	padding-left:10pt;
	padding-right:10pt;
}

/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #2C3B86;
	color:white;
}

/* Style the tab content */
.tabcontent {
    display: none;
    border: 1px solid #ccc;
    border-top: none;
	width:90%; 
	background-image: url('../images/499130746 tr.jpg'); 
	background-repeat: repeat-y; 
	background-size:100%; 
	margin:10pt;
	margin-top:0;
	margin-bottom:20pt; 
	margin-left:5%; 
	padding:10pt;
}

.newsroomBullet a:link{
	color: #2C3B86;
	text-decoration:none;
}

.newsroomBullet a:visited {
	color: #2C3B86;
	text-decoration:none;
}

.newsroomBullet a:hover {
	color: #3373BC;
	text-decoration:none;
}

.newsroomBullet a:active {
	color: #B546F1;
	text-decoration:none;
}

.aLink:link{
	color: #2C3B86;
	text-decoration:none;
}

.aLink:visited {
	color: #2C3B86;
	text-decoration:none;
}

.aLink:hover {
	color: #3373BC;
	text-decoration:none;
}

.aLink:active {
	color: #B546F1;
	text-decoration:none;
}

/*RATINGS*/

.0thinker{
	width: 20px;
	height: 20px;
}

.ratingButton{
	background:none;
	border:none;
	cursor:pointer;
}

.boldContent{
	font-family:'FranklinGothicDemi';
	font-size:12pt;
	line-height:14pt;
	color:#010101;
}

.item:hover{
	cursor:pointer;
	background-color: #B3CBFF !important;
}

.missionLinkRed:link{
	color: red;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkRed:visited {
	color: red;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkRed:hover {
	color: darkred;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.missionLinkRed:active {
	color: #B546F1;
	text-decoration:none;
	font-family:'FranklinGothicDemi';
}

.blueBox {
	font-family:'FranklinGothicBook';
	font-size:12pt;
	line-height:14.5pt;
	background-color: rgb(222, 232, 243);
	border: 2px solid rgb(165, 192, 223);
}

.groupName:hover {
	color: #3373BC;
}

.groupDescription{
	transition: max-height 1s;
}

.post{
	background-color: rgb(222, 232, 243);
	font-family:FranklinGothicBook;
	font-size:10pt;
	line-height:13pt;
	padding:12pt;
}

.commentsBox{
	background-color: rgb(234, 240, 247);
	font-family:FranklinGothicBook;
	font-size:10pt;
	line-height:13pt;
	padding:12pt;
    transition: max-height 0.25s ease-in;
	overflow:hidden;
}

.activityLink{
	border-color:transparent;
	background-color:transparent;
	padding:5pt;
}

.activityLink:link{
	color: #010101;
	text-decoration:none;
	font-family:'FranklinGothicBook';
}

.activityLink:visited {
	color: #010101;
	text-decoration:none;
	font-family:'FranklinGothicBook';
}

.activityLink:hover {
	color: #46D7F1;
	text-decoration:none;
	font-family:'FranklinGothicBook';
}

.activityLink:active {
	color: #46D7F1;
	text-decoration:none;
	font-family:'FranklinGothicBook';
}

mark {
	background-color: #EAC8FC;
}

#specialpricingoptions {
	color:blue;
	cursor:pointer;
}

  /* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.modal-close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.modal-close:hover,
.modal-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
} 

/* Add Animation */
@keyframes animatetop {
  from {top: -300px; opacity: 0}
  to {top: 0; opacity: 1}
}

#myInput {
  box-sizing: border-box;
  font-size: 16px;
  padding: 14px 20px 12px 14px;
  border: none;
  border-bottom: 1px solid #ddd;
}

#myInput:focus {outline: 3px solid #ddd;}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown2 {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  position: absolute;
  background-color: #f6f6f6;
  min-width: 230px;
  overflow: auto;
  border: 1px solid #ddd;
  z-index: 1;
  display:none;
}

.dropdown-content2 {
  position: absolute;
  background-color: #f6f6f6;
  min-width: 230px;
  overflow: auto;
  border: 1px solid #ddd;
  z-index: 1;
  display:none;
}

.dropdown-content select {
  overflow-y:scroll;
}

.dropdown-content2 select {
  overflow-y:scroll;
}

.dropdown-content option {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content2 option {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown option:hover {background-color: #ddd;}

.dropdown2 option:hover {background-color: #ddd;}

.ql-editor {
	line-height: normal;
}

.ql-editor a:link{
	color: #2C3B86;
}

.ql-editor a:visited {
	color: #2C3B86;
}

.ql-editor a:hover {
	cursor: pointer;
}