@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@font-face {
	font-family: 'Gotham Black Regular';
	src: url('Gotham Black Regular.eot');
	src: url('Gotham Black Regular.eot?#iefix') format('embedded-opentype'), url('Gotham Black Regular.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'GothamBlack';
	src: url('GothamBlack.svg#GothamBlack') format('svg'), url('GothamBlack.ttf') format('truetype'), url('GothamBlack.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
.gotham {
	font-family: 'Gotham Black Regular' !important;
}

.center { text-align: center; }.left { text-align: left; }.right { text-align: right; }.icon { width: 38px; }.icon-small { width: 30px; }.icon-med { height: 45px; }.icon-big { width: 75px; }
.contentHdr { border-bottom: 1px solid #ccc; margin-bottom: 10px; }.contentHdr a { font-weight: bold; font-size: 14pt; text-decoration: none !important; }
.altbg { background: #f5faff; }
.chk {   color: #31829c;  background-color: #e8f9ff;  border-color: #2f629a;  padding: 15px;  margin-bottom: 20px;  border: 1px solid transparent;  border-top-color: transparent;  border-right-color: transparent;  border-bottom-color: transparent;  border-left-color: transparent;  border-radius: 4px;}
.styledSelect { font-size: 13pt; border: 1px solid #ccc; padding: 3px; }
.mainContentContainer {   border-radius: 10px;  border: 1px solid #ccc;  padding: 15px 30px;  background: #fff;  margin: 0 auto;  width: 60%;}
.page-header {  margin: 40px 0 20px;  line-height: 16pt;   /*font-family: 'Amiri', serif;*/  font-family: 'open sans';  letter-spacing: -.3pt;   color: #2f629a;  font-weight: bold;}
.page-header .icon-small, .page-header .icon-med, .page-header .icon-big { 
  margin-top: -15px; 
  float: left;
  margin-right:5px;
}

.articlinks input { width: 100%; }
.articlinks { margin-bottom: 10px; }

.timeline-body { font-family: 'open sans'; }

.btn-default { color: #2f629a; border: 1px solid #ccc; }
.btn-default:hover { color: #174271 !important; border: 1px solid #174271 !important; }

.panel-heading .icon-med { height: 30px; margin-top: -5px; }

.timeline-title { color: #2f629a; }

.tab-pane h2 { font-family: 'open sans'; font-size: 19pt; font-weight: bold; }

.text-center { text-align: center; }

.panel-heading { 
  font-family: 'open sans';
  font-size: 15pt !important; 
  color: #2f629a !important;
  line-height: 26px;
}

h1 .slash { color: #ccc; font-weight: normal; }
h1 .subline { color: #6e736f !important; font-weight: normal; }

.fadeinout { position: absolute; top: 0px; right: 0px; }
  
.grad_bg {
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(239,239,239,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 ); /* IE6-9 */
}

.redCircle { background: #c22121; color: #fff; border-radius: 50%; padding: 7px 4px 5px 4px; margin-left: -5px; }
.blueCircle { background: #1818b4; color: #fff; border-radius: 50%; padding: 7px 4px 5px 4px; margin-left: -5px;  }
.orangeCircle { background: #ef7b00; color: #fff; border-radius: 50%; padding: 7px 4px 5px 4px; margin-left: -5px;    }
.purpleCircle { background: #800080; color: #fff; border-radius: 50%; padding: 7px 4px 5px 4px; margin-left: -5px;  }
.greenCircle { background: #008000; color: #fff; border-radius: 50%; padding: 7px 6px 5px 6px;   }

.green { color: green; }
.grey { color: #696969; }
.blue { color: #2323c8; }
.darkblue { color: darkblue; }
.white { color: #fff !important; }
.black { color: #000 !important; }
.orange { color: #e17604; }
.cream { color: #f2a16a; }
.green { color: #008000; }
.red { color: #b71f1f; }
.yellow { color: #d2c310; }
.purple { color: #6d006d; }
.teal { color: #0f9aaa; }
.softgreen { color: #0db05a; }

.creamline { background: #f2a16a; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px; }
.blueline { background: #2323c8; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }
.orangeline { background: #e17604; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }
.purpleline { background: #6d006d; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }
.greenline { background: #008000; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }
.yellowline { background: #d2c310; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }
.redline { background: #b71f1f; height: 2px; margin-bottom: 25px; width: 290px; margin: 0 auto; margin-bottom: 15px;  }

 
.correctAnswer { color: red; font-weight: bold; margin-top: 10px; font-size: larger; }

.divHdr { background: #f1f1f1; padding: 10px; border-bottom: 1px solid #ccc; margin-bottom: 10px; font-weight: bold; color: #2e6aab; }
.inline { display: inline-block; }
.mbtm15 { margin-bottom: 15px; }
.u { text-decoration: underline; }
.blue { color: #2e6aab; }

.inline-block { display: inline-block; }
.padleft15 { padding-left: 15px; }
.padleft20 { padding-left: 20px; }

.error { padding: 10px 15px; background: #fff5f5; color: #bf0c0c; border-radius: 7px; margin-bottom: 20px; box-shadow: 1px 1px 3px #ecd5d5; }
.error span { font-weight: bold; color: #bf0c0c; }

.box { box-shadow: 0 0 10px #e9e9e9; padding: 15px; margin: 10px 0; }

.timeline-heading h2 { 
  font-family: 'open sans';
  font-size: 15pt !important; 
  color: #2f629a !important;
  line-height: 26pt;
}

.topErr { position: absolute; top: 0; left: 0; background: #fff; z-index: 99999999999999; padding: 20px; font-size: 8pt; }
.topErr pre { font-size: 8pt !important; }
.gradBg {   
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d6e2f2+0,fbfeff+95 */
background: rgb(214,226,242); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(214,226,242,1) 0%, rgba(251,254,255,1) 95%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(214,226,242,1) 0%,rgba(251,254,255,1) 95%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(214,226,242,1) 0%,rgba(251,254,255,1) 95%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6e2f2', endColorstr='#fbfeff',GradientType=0 ); /* IE6-9 */

}
.panelstyle { 
box-shadow: 0px 0px 3px #ccc;
border: 1px solid #fff; 
}

.green { color: green !important; }
.grey { color: #696969; }
.blue { color: #2f629a; }
.gold { color: gold; }
.borderGreen { border: 2px solid green; }
.red { color: red; }
.white { color: white; }


.fontLarge { font-size: 15pt; }
.fontLarger { font-size: 17pt; }
.fontLargest { font-size: 22pt; }

.breadcrumbs { padding-left: 20px; margin-bottom: 15px; }
.breadcrumbs i { margin: 0 10px; }

.btmBorder, .btmBorder td { border-bottom: 1px solid #e9e9e9; margin-bottom: 15px; }
.btmBorder { border-bottom: 1px solid #e9e9e9; margin-bottom: 15px; }
.trBtmBorder td { border-bottom: 1px solid #e9e9e9; }

.shadow { box-shadow: 0px 0px 10px #e9e9e9; }
.border { border: 1px solid #ccc; }
.roundborder { border-radius: 10px; }
.bg { background: #f1f1f1; }
.bgwhite { background: #fff; }

.pad5 { padding: 5px; }
.pad10 { padding: 10px; }
.pad15 { padding: 15px; }
.pad20 { padding: 20px; }
.pad30 { padding: 30px; }
.pad40 { padding: 40px; }
.pad50 { padding: 50px; }
.padbtm10 { padding-bottom: 10px; }
.padbtm15 { padding-bottom: 15px; }
.padbtm20 { padding-bottom: 20px; }
.padbtm25 { padding-bottom: 25px; }
.padbtm30 { padding-bottom: 30px; }

.mbtm5 { margin-bottom: 5px; }
.mbtm10 { margin-bottom: 10px; }
.mbtm15 { margin-bottom: 15px; }
.mbtm20 { margin-bottom: 20px; }
.mright10, .mr10 { margin-right: 10px; }
.mright15, .mr15 { margin-right: 15px; }
.mright20, .mr20 { margin-right: 20px; }
.mright20, .mr25 { margin-right: 25px; }
.mright20, .mr30 { margin-right: 30px; }


.m10 { margin: 10px; }
.m15 { margin: 15px; }
.m20 { margin: 20px; }
.m30 { margin: 30px; }
.mauto { margin: auto; }

.mtop10 { margin-top: 10px; }
.mtop15 { margin-top: 15px; }
.mtop20 { margin-top: 20px; }
.mtop30 { margin-top: 30px; }
.mtop40 { margin-top: 40px; }
.mtop50 { margin-top: 50px; }
.mtop60 { margin-top: 60px; }

.w100 { width: 100px; }
.w150 { width: 150px; }
.w200 { width: 200px; }
.w250 { width: 250px; }
.w300 { width: 300px; }
.w350 { width: 350px; }
.w400 { width: 400px; }

.w100p { width: 100%; }
.w90p { width: 90%; }
.w80p { width: 80%; }
.w85p { width: 85%; }
.w70p { width: 70%; }
.w75p { width: 75%; }
.w60p { width: 60%; }
.w65p { width: 65%; }
.w50p { width: 50%; }
.w40p { width: 40%; }
.w30p { width: 30%; }
.w20p { width: 20%; }
.w10p { width: 10%; }

.strong, .bold { font-weight: bold; }

.h1 { font-size: 21pt; }
.h2 { font-size: 18pt; margin: 0; margin-bottom: 15px; }
.h3 { font-size: 15pt; }

div.tdHdr, .tdHdr td { background: #f1f1f1; border-bottom: 1px solid #ccc; padding: 4px; }
div.tdHdr, .tdHdr td, .tdHdr th { background: #f1f1f1; border-bottom: 1px solid #ccc; padding: 4px; }

.tdbg { background: #f1f1f1; border-bottom: 1px solid #ccc; padding: 4px; }

.dbTopic { width: 100%; position: relative; }
.dbTopic .img { float: left; overflow: hidden;  }
.dbTopic .img img { width:190px; }
.dbTopic .details { margin-left: 220px;  }
.dbTopic .title a { font-size: 16pt; font-weight: bold; }
.dbTopic .admin { margin: 12px 0; }
.dbTopic .viewButton { margin-bottom: 15px; text-align: right; }

.smallest { font-size: 8pt; }
.small { font-size: 11pt; }
.med { font-size: 14pt; }
.big { font-size: 18pt; }

.paginate { margin-bottom: 15px; }
.paginate span { border: 1px solid #ccc; padding: 3px 5px; display: inline-block; border-right: 0; }
.paginate span:first-child { border-left: 1px solid #ccc; }
.paginate span:last-child { border-right: 1px solid #ccc; }

.quizQ { margin-bottom: 35px; }
.quizQ input[type=radio]{ display:none; }
.quizQ input[type="radio"]:checked + label { 	background: #49acff; color: #000; border: 3px solid #fff; box-shadow: 1px 1px 3px #ccc; }
.quizQuestion { width: 100%; }
.quizQ .question .questionText { font-size: 12pt; background-color:#f1f1f1; padding: 12px; width: 100%; border-radius: 6px; color: #000; }
.quizQ textarea { width: 100%; border: 1px solid #ccc; box-shadow: 1px 1px 3px #ccc; padding: 4px; }

.attachLinkBox { float: left; margin-right: 15px; }

.fleft { float: left; }
.fright { float: right; }

.mtopbtm15 { margin-top: 15px; margin-bottom: 15px; }
.mbtm15 { margin-bottom: 15px; }
.mbtm25 { margin-bottom: 25px; }

.activityRow1 { background: #fff; border: 1px solid #fff;  margin-bottom: 30px; box-shadow: 1px 1px 9px #e9e9e9; }
.activityRow2 { background: #fff; border: 1px solid #fff;  margin-bottom: 30px; box-shadow: 1px 1px 9px #e9e9e9; }

.indent { padding-left: 15px; }
   
   
@media (max-width: 768px) {
  #friends_sidebar { display: none; }
}

#tab-content .fade {
  display:none;
  opacity:0;
}
#tab-content .active  {
  display: block;
  opacity:1;
}
#tab-content h2 { color: #2f629a !important; }

.sep { border-bottom: 3px solid #fff; margin-top: 10px; margin-bottom: 25px; box-shadow: 1px 1px 3px #ccc; }

.btn-full { width: 100%; }

/* mailbox */
.mailList .message { border: 1px solid #ccc; padding: 10px; margin-bottom: 5px; box-shadow: 1px 1px 3px #ccc; position: relative;  }
.mailList .new { border: 1px solid #e0dca0; box-shadow: 1px 1px 3px #ffffeb; background: #fffde1; }
.mailList .del { float: left; width: 25px;  }
.mailList .date {  padding-left: 35px;  }
.mailList .subject { font-weight: bold; font-size: 14pt; padding-left: 35px; }
.mailList .from { padding-left: 35px; }
.mailList .actions {  padding-left: 35px; position: absolute; bottom: 2px; right: 2px; }
.mailList a { color: #000; }
.mailList a:hover { color: #18468c; }

.alert-success { display: none; }

/* custom upload button */
  .upload-btn-wrapper {
    position: relative;
    overflow: hidden;
    display: inline-block;
  }
  
  .uploadbtn {
    border: 2px solid gray;
    color: gray;
    background-color: white;
    padding: 8px 20px;
    border-radius: 8px;
    font-size: 20px;
    font-weight: bold;
  }
  
  .upload-btn-wrapper input[type=file] {
    font-size: 100px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;    cursor: pointer;
  }

#db_list { width: 100%; }


.top-menu-p ul.navbar-nav2 {
	float: left;
}
.top-menu-p ul.navbar-nav2 a {
	border-radius: 5px;
	background-image: url(../images/menu-bg0.png);
	background-size: 100% 100%;
	color: #fff;
	font-weight: bold;
	width: 106px;
	text-align: center;
	font-size: 12px;
	padding: 6px 20px;
        margin-right: -3px;
}
.top-menu-p ul.navbar-nav2 li.menu-color1 a {
	background-image: url(../images/menu-bg1.png);
	background-size: 100% 100%;
}
.top-menu-p ul.navbar-nav2 li.menu-color2 a {
	background-image: url(../images/menu-bg2.png);
	background-size: 100% 100%;
}
.top-menu-p ul.navbar-nav2 li.menu-color3 a {
	background-image: url(../images/menu-bg3.png);
	background-size: 100% 100%;
}