
html,
body {
    color: var(--pi-ink-900, #122033);
    font-family: var(--pi-font-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    margin: 0;
    max-width: 100%;
    padding: 0;
}

body {
    background: var(--pi-paper, #ffffff);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    overflow-x: visible;
    width: 100%;
}

a.navigation {
    padding: 0px 10px;
    word-wrap: normal;
    display: inline-block;
}

/* navbar */
.navbar-light {
    background-color: rgb(248, 248, 248);
    border-color: #E7E7E7;
}

.wrap {
    min-width: 0;
    width: 100%;
}

.starter-template {
  padding: 40px 15px;
  text-align: center;
}


.panel-padding {
    position: relative;
    padding-left: 20px;
}

.footer {
  padding-top: 40px;
  padding-bottom: 40px;
  margin-top: 40px;
  border-top: 1px solid #eee;

}

.alert {
    margin-top: 55px;
    margin-bottom: 0;
}

body>.navbar-transparent {
    background-color: white;
    border-color: white;
    box-shadow: none;
}

.navbar-transparent .navbar-nav > .active > a {
    background-color: white;
}



/* Home page styling */
.corporate-jumbo2 {
    background-image: linear-gradient(rgba(10, 10, 10, 0.5), rgba(10, 10, 10, 0.5)), url("/static/site/img/banner.b699c10edd99.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-size: cover;
    color: #f5f5f5;
    padding: 10em 0;
    margin-bottom: 0;
    height: 350px;
}

.cover-jumbo {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAJklEQVQIW2NkAIILFy78NzAwYATRjCABZEGwAEwFiA1WBlIOUwkA72gTdDIYVO4AAAAASUVORK5CYII=) repeat;
    padding-top: 9.5em;
    padding-bottom: 10em;
    margin-bottom: 0;
    height: 50px;
}

.cover-class {
    background: url("../img/learning_online.27d0e2951170.jpg");
    padding-top: 5.5em;
    padding-bottom: 4.5em;
    margin-bottom: 0;
    height: 400px;
    background-size: 1115px;
}

.cover-class-portfolio {
    background: url("../img/portfolio_cover.c1410d94e21e.jpg");
    padding-top: 5.5em;
    padding-bottom: 4.5em;
    margin-bottom: 0;
    height: 400px;
    background-size: 1110px;
}

.cover-class-start-investing {
    background: url("../img/computer_mac.76b69839f720.jpg");
    padding-top: 5.5em;
    padding-bottom: 4.5em;
    margin-bottom: 0;
    height: 400px;
    background-size: 1110px;
}


.cover-class-backtest {
    /*background: url("../img/home_cover.24c13b28f2a6.jpg");*/
    background-color: #FFFFFF;
    padding-top: 3.5em;
    padding-bottom: 3.5em;
    margin-bottom: 0;
    height: 600px;
    background-size: 1110px;
    max-width: 100% !important;
}


/* Home page styling */
.cover-image {    
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-size: cover;
    color: #f5f5f5;
    padding: 10em 0;
    margin-bottom: 0;
    height: 350px;
}

.corporate-jumbo .well {
    background-color: rgba(248, 248, 248, .7);
}

.corporate-jumbo p, .corporate-jumbo h1 {
    color: #eee;
    text-shadow: 0px 0px 2px black;
}

.corporate-jumbo p {
    font-weight: 500;
}

.corporate-jumbo .well legend {
    color: #333;
}

.background-light-grey {
    background-color: rgb(250, 250, 250);
}

.background-blue {
    background-color: #02203c;
}

.background-dark-grey {
    background-color: rgb(252, 252, 252);
}

.corporate-jumbo > .container {
    display: block;
    bottom: 0em;
  
}


.contact-banner {
    padding: 100px 0;
    background: #e0e0e0;
    margin-top: 100px;
}

.footer a:hover {
    text-decoration: none;
}

.footer-social-links {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin: 10px -8px 0 0;
}

.footer-social-links .footer-social-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: #4b5563 !important;
    background: transparent;
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    transition: color 140ms ease, transform 140ms ease;
}

.footer-social-links .footer-social-link::after {
    position: absolute;
    right: 14px;
    bottom: 6px;
    left: 14px;
    height: 2px;
    border-radius: 2px;
    background: #0052cc;
    content: "";
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 140ms ease;
}

.footer-social-links .footer-social-link:hover,
.footer-social-links .footer-social-link:focus-visible {
    color: #0052cc !important;
    transform: translateY(-1px);
}

.footer-social-links .footer-social-link:hover::after,
.footer-social-links .footer-social-link:focus-visible::after {
    transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
    .footer-social-links .footer-social-link,
    .footer-social-links .footer-social-link::after {
        transition: none;
    }

    .footer-social-links .footer-social-link:hover,
    .footer-social-links .footer-social-link:focus-visible {
        transform: none;
    }
}

/* About page styling */
#sec1 {
    background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAJklEQVQIW2NkAIILFy78NzAwYATRjCABZEGwAEwFiA1WBlIOUwkA72gTdDIYVO4AAAAASUVORK5CYII=) repeat;
}

/* Profile page styling */
.profile-head {
    background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAJklEQVQIW2NkAIILFy78NzAwYATRjCABZEGwAEwFiA1WBlIOUwkA72gTdDIYVO4AAAAASUVORK5CYII=) repeat;
    padding: 70px 0px 30px 20px;
}
.profile-body {
    padding: 4px 0px;
}

.text-page {
    padding: 120px 0;
}

#map-outer {
    height: 440px;
    padding: 40px 20px;
    margin-bottom: 20px;
    background-color:#FFF
}

#map-container {
    height: 400px
}

.img-dim {
    opacity: 0.5;
    box-shadow: inset 0px 0px 64px 64px #EA1717, 0px 0px 4px 4px #EA1717;
}

.img-circle {
    border-radius: 50%; 
}

.img-circle-border {
    border-radius: 50%;
    border: 2px solid #0275d8;
}

#profile-picture-position
{
    padding-top: 7px;
    margin-top: 0px;
    border-top: 0px;
}
/* Authentication forms */
.form-box form,
.form-box .form-message {
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
}

.form-box form .checkbox {
  margin-bottom: 10px;
}

.form-box form .checkbox {
  font-weight: normal;
}

.form-box form .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 6px !important;
  font-size: 16px;
}

.form-box form .form-control:focus {
  z-index: 2;
}

#subject-card-title {
    font-size: 20px;
}

#subject-card-subtext {
    font-size: 15px;
}

#profile-text {
    font-size: 17px;
}

.subject-card-text-position {
    padding: 10px;
    margin: 0px;
    border: 0px;
}


.nav-height {
    height: 60px;
}

.jumbo-padding {
    padding: 0px;
    margin: 0px;
    border: 0px;
}

.nav-padding {
    padding: 0px;
    margin-left: 15%;
    margin-right: 15%;
    border: 0px;
}

.content-padding {
    height: 55px;
}


.jumbo-background-color-light {
    background-color: rgb(248,248,248);
}

.jumbo-background-color-dark {
    background-color: rgb(252,252,252);
}

.cardlink {
    text-decoration: none;
}

.cardlink:hover {
    text-decoration: none;
}

.description-font {
    padding: 3px;
    text-align: center;
}

.description-font-position {
    padding-left: 30px;
    margin: 0px;
    border: 0px;
}

.list-item-position {
    padding-left: 7px;
}

.imageClip {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding-top: 7px;
    padding-bottom: 7px;
}

hr {
    clear: both;
    display: block;
    width: 100%;
    height: 5px;
}

.arrow-up {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgb(150,150,150);
}

.arrow-down {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-top: 12px solid rgb(150,150,150);
}

.arrow-right {
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid black;
}

.arrow-left {
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-right: 20px solid black;
}

.jumbo-color-dark {
    color: rgb(248,248,248);
}

.thumbs {
    text-decoration: none;
    color: rgb(165,165,165);
}

.thumbs-chosen {
    text-decoration: none;
    color: #007bff;
}

.thumbs:hover {
    text-decoration: none;
    color: #007bff;
}

.thumbs-chosen:hover {
    text-decoration: none;
    color: #007bff;
}

.thumbs-offline {
    text-decoration: none;
    color: rgb(165,165,165);
}

.navbar-nav > li {
    float: left;
    position: relative;
}

/*.navbar-nav .active a::after{*/
    /*border-bottom: 2px solid #007bff;*/
    /*content: " ";*/
    /*left: 0;*/
    /*position: absolute;*/
    /*right: 0;*/
/*}*/

#navbarcustomactive .active {
    color:#253858 !important;
}

@media only screen and (max-width : 992px) {
    .navbar-nav .active a::after {
        border-bottom: transparent;
    }

    .content-padding {
        height: 220px !important;;
    }

    #site_title {
        font-size: 46px !important;;
    }
    #site_subtitle {
        font-size: 19px !important;;
    }
    #cover_home {
        padding-top: 60px !important;;
    }
    #site_title_div {
        width: 332px !important;
    }

    #site_title_div4 {
         text-align: center !important;
    }


    #site_title_div2 {
        width: 332px !important;
        height: 102px !important;
    }
       #site_title_div3 {
        width: 300px !important;
        height: 85px !important;
    }
}

.btn:active {
   outline: none !important;
   box-shadow: none !important;
}

.comments_show_more {
    color: #007bff;
}

.btn-hover:hover
{
background-image:none !important;
color: rgba(0, 0, 0, .91) !important;
}

.dropdown-toggle-no-arrow::after {
    display:none !important;
}

.card {
    border-radius: 0;
}

#mainNav {
    position: static;
    padding: 0px;
    top: 0px;
    position: absolute;
    width: 100%;
    border-bottom: 0px solid #F2F2F2;
}

.page-link{
  color:#0052CC;
}

.page-link:hover {
    color:#0052CC;
}

.page-link:active {
    color: white;
}

.btn-primary{
  background-color:#0052CC;
  border-color:#0052CC;
}

a {
  color:rgba(0, 0, 0, .82);
  border-color:rgba(0, 0, 0, .82);
}

.text-primary {
  color:#0052CC !important;
  border-color:#0052CC !important;
}

.badge-primary {
  background-color:#0052CC !important;
  border-color:#0052CC !important;
}

a:hover {
    color:rgba(0, 0, 0, .82);
    border-color:rgba(0, 0, 0, .82);
}

.text-dark {
   color:rgba(0, 0, 0, .82) !important;
  border-color:rgba(0, 0, 0, .82) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    border-color: currentColor;
    color: inherit;
    font-family: inherit;
}


/* If the screen size is 701px wide or more, set the font-size of <div> to 80px */
@media screen and (min-width: 801px) {
  div.reading-font {
    font-size: 20px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 800px) and (min-width: 601px) {
  div.reading-font {
    font-size: 20px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px){
  div.reading-font {
    font-size: 18px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px){
  .cta-button {
      font-size: 19px !important;
  }

  h1.heading1-font {
    font-size: 28px;
  }

  h2.heading2-font {
    font-size: 28px;
  }
}

/* If the screen size is 701px wide or more, set the font-size of <div> to 80px */
@media screen and (min-width: 601px) {
  div.loading_spinner {
    font-size: 24px; position: fixed;
                z-index: 1031; top: 38%; left: 46%; transform: translate(-50%, -50%); min-width: 400px;
  }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px){
  div.loading_spinner {
    font-size: 18px; position: fixed;
                z-index: 1031; top: 42%; left: 46%; transform: translate(-50%, -50%); min-width: 300px;
  }
}

.reading-font,
.reading-font > p,
.reading-font > ol > li,
.reading-font > ol > li > p,
.reading-font > ul > li,
.reading-font > ul > li > p,
.reading-font > div {
    color: inherit;
    font-family: var(--pi-font-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    text-align: left;
}

.reading-font > p > a {
    text-decoration: none !important;
    box-shadow: inset 0 0px 0 white, inset 0 -1px 0 rgba(0, 0, 0, .82) !important;
    text-align: left;
}

.sm-button-follow {
    border-color:rgba(0,0,0,.78) !important;
    color:rgba(0,0,0,.78) !important;
    background-color: transparent !important;
    font-size: 12px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin: 3px;
}

.lg-button-follow, .lg-button-follow:hover
{   text-decoration: none !important;
color: rgba(0,0,0,.78) !important;
    border-color:rgba(0,0,0,.78) !important;
}

.lg-button-signup, .lg-button-signup:hover
{   text-decoration: none !important;
    color: rgba(255, 255, 255, 1.0) !important;
    border-color:transparent !important;
    background-color:rgba(0,0,0,.78) !important;
}


/*.text-primary {*/
  /*color:#0052CC !important;*/
  /*border-color:#0052CC !important;;*/
/*}*/

.btn:focus {
  outline: none !important;
}

.btn, .btn:hover, .btn:active,
.btn:active:focus, .btn:visited, .btn:focus { outline: none; cursor: pointer !important;}

button:focus {outline: none !important;}

.outer {
  display: table;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.middle {
  display: table-cell;
  vertical-align: middle;
}

.inner {
  margin-left: auto;
  margin-right: auto;
  width: 95%;
  max-width: 800px;
  /*whatever width you want*/
}

.signin, .signin:hover
{   text-decoration: none;
color: #0052CC; border-color: #0052CC;
}

.div-outline-dark {
    font-size: 13px;
    padding-bottom: 10px;
    height: 35px;
    border: 1px solid #868e96;
    background-color: rgba(0, 0, 0, 0.05) !important;
    color: rgba(0,0,0,.68) !important;
    border-color: transparent !important;
}

.div-outline-dark:hover
{
     color:#868e96; !important;
     border-color: transparent !important;
     background-color: rgba(0, 0, 0, 0.1) !important;
     text-decoration:none;
     cursor:pointer;
}

.div-outline-blue {
    font-size: 13px;
    padding-bottom: 10px;
    height: 35px;
    border: 1px solid #868e96;
    background-color: rgba(0, 120, 215, 0.1) !important;
    color: rgba(0,0,0,.68) !important;
    border-color: transparent !important;
}

.div-outline-blue:hover
{
     color:#868e96; !important;
     border-color: transparent !important;
     background-color: rgba(0, 120, 215, 0.21) !important;
     text-decoration:none;
     cursor:pointer;
}

.fa-dark {
    color: rgba(0, 0, 0, .74) !important;
    text-decoration: none !important;
    padding: 8px;
    font-size: 22px;
    outline: none !important;
}

.fa-dark:hover {
    color: rgba(0, 0, 0, .91) !important;
    text-decoration:none !important;
    padding: 8px;
    font-size: 22px;
    outline: none !important;
}

.blog_message > p img {
   height: auto !important;
   max-width: 100% !important;
}

/** Social Button CSS **/

.share-btn {
    display: inline-block;
    color: #ffffff;
    border: none;
    padding: 0.5em;
    width: 4em;
    outline: none;
    text-align: center;
}

.share-btn:hover {
  color: #eeeeee;
}

.share-btn:active {
  position: relative;
  top: 2px;
  box-shadow: none;
  color: #e2e2e2;
  outline: none;
}

.text-muted-dark {
    color: rgb(100, 100, 100) !important;
}

#dropdown-search-list .selected {
    text-decoration: none !important;
    background-color: rgba(0,0,0,0.05) !important;;
}

#nav-bar-dropdown-search-list .selected {
    text-decoration: none;
    background-color: rgba(0,0,0,0.05);
}

#form-dropdown-search-list .selected {
    text-decoration: none;
    background-color: rgba(0,0,0,0.05);
}

#bench-dropdown-search-list .selected {
    text-decoration: none;
    background-color: rgba(0,0,0,0.05);
}

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}


@media only screen and (max-width: 800px) {

	/* Force table to not be like tables anymore */
	#no-more-tables table,
	#no-more-tables thead,
	#no-more-tables tbody,
	#no-more-tables th,
	#no-more-tables td,
	#no-more-tables tr {
		display: block;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	#no-more-tables thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	#no-more-tables tr { border: 16px solid #e9ecef; }

	#no-more-tables td {
		/* Behave  like a "row" */
		border: none;
		/*border-bottom: 1px solid #eee;*/
		position: relative;
		padding-left: 50%;
		white-space: normal;
		text-align:left;
        /*border: 0.1px solid #e9ecef;*/
	}

	#no-more-tables td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 10.5px;
		left: 10.5px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}

	/*
	Label the data
	*/
	#no-more-tables td:before { content: attr(data-title); }
}

.checkboxes label {
  display: inline-block;
  padding-right: 10px;
  white-space: nowrap;
}
.checkboxes input {
  vertical-align: middle;
}
.checkboxes label span {
  vertical-align: middle;
}

.no-border{
  border:none !important;
  border-bottom: 0 none !important;
border-top: 0 none !important;
}

.table td, .table th {
    padding: .5rem !important;
    vertical-align: top !important;
    border-top: 1px solid #e9ecef !important;
}

.table th {
    font-weight: normal; background-color: rgb(245, 245, 245) !important;
    border-top: 0px solid #e9ecef !important;
    border-bottom: 0px solid #e9ecef !important;
    color: #868e96 !important;
    font-size: 14px !important;
}

.share-btn.twitter     { background: #55acee; }
.share-btn.google-plus { background: #dd4b39; }
.share-btn.facebook    { background: #3B5998; }
.share-btn.stumbleupon { background: #EB4823; }
.share-btn.reddit      { background: #ff5700; }
.share-btn.linkedin    { background: #4875B4; }
.share-btn.email       { background: #444444; }
