/*@font-face { font-family: 'Brown'; src: local('Brown-Regular'), url('https://ologyeducation.org/wp-content/themes/joyn/css/font/brown-regular.woff2') format('woff2'), url('https://ologyeducation.org/wp-content/themes/joyn/css/font/brown-regular.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Brown'; src: local('Brown-Bold'), url('https://ologyeducation.org/wp-content/themes/joyn/css/font/brown-bold.woff2') format('woff2'), url('https://ologyeducation.org/wp-content/themes/joyn/css/font/brown-bold.woff') format('woff'); font-weight: bold; font-style: normal; }

body, p, h1, h2, h3, h4, h5, h6 { font-family: "Brown" !important; }
#main-nav, #header nav, #vertical-nav nav, .header-9#header-section #main-nav, #overlay-menu nav, #mobile-menu, #one-page-nav li .hover-caption, .mobile-search-form input[type="text"] { font-family: "Brown" !important; font-weight: bold !important; }*/






  /* Space out content a bit */
  body {
    /*padding-top: 1.5rem;*/
    /*padding-bottom: 1.5rem;*/
    font-family: 'Open Sans', sans-serif;
    font-size: 1rem;
    
  }

  a:link {
    color: inherit;
    text-decoration: none;
  }

  a:visited {
    color: inherit;
    text-decoration: none;
  }

  a:hover {
    color: inherit;
    text-decoration: none;
  }

  a:active {
    color: inherit;
    text-decoration: none;
  }

  /* Everything but the jumbotron gets side spacing for mobile first views */
  .header,
  .marketing,
  .footer {
    /*padding-right: 1rem;*/
    /*padding-left: 1rem;*/
  }

  /* Custom page header */
  .header {
    padding-bottom: 1rem;
    border-bottom: .05rem solid #e5e5e5;
  }
  /* Make the masthead heading the same height as the navigation */
  .header h3 {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 3rem;
  }

  /* Custom page footer */
  .footer {
    padding-top: 1.5rem;
    color: #777;
    border-top: .05rem solid #e5e5e5;
  }

  .supermenu{
    background-color: #B51F3E;
    min-height: 50px;
    border-bottom-style: solid;
    border-bottom-width: 15px;
    border-bottom-color: #FBF4DB;
    position:fixed; 
    top:0

  }

  .supermenu_item{
    float: right;
    color: #FFF;
    font-size: 1.0rem;
    padding-left: 10px;
    padding-right: 10px;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #1F5D95;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .supermenu_item.end{
    border-right-style: solid;
    border-right-width: 1px;
    border-right-color: #7a2a84;
  }

  .mainmenu{
    background-color: #FFF!important;
    box-shadow: 0 5px 8px -2px #bababa;
    margin-bottom: 0px;
    position:fixed; 
    top:50px;
    height: 61px;
  }

  .container {

    width: 100%;
    margin-right: 0;
    margin-left: 0;
    max-width: inherit;
      
    }

    .supermenu_area{
      margin-left: auto;
      margin-right: auto;
    }

    .welcome{
      background-color: #FFF;
      background-image: url("../img/welcome_bg.png");
      background-repeat:no-repeat;
      background-size:cover;
      background-position:center;
      
      padding-top: 20px !important;
    }

    .adbar{
      background-color: #FFF;
      background-repeat:no-repeat;
      background-size:cover;
      background-position:center;
      padding: 0px;
      margin-top: 110px;

    }

    .call{
      background-color: #e6a22d;
      padding: 10px;
      text-align: center;
      font-weight: bold;

    }
    .programme{
      background-color: #FFF;
      padding: 10px;
      text-align: left;
      margin-top: 0px;

    }

    .iconbar{
      padding: 0px;
      text-align: left;
      color: #FFF;
      padding: 10px;
      margin-bottom: 0px;

    }

    .iconbar_row{
   

    }

    .puzzleimg{
      position: absolute;
      top:5px;
      left:0;
    }

    .puzzleimg-down{
      position: absolute;
      top:0px;
      left:0;
    }

    .iconbar_full{
      background: linear-gradient(90deg, #c32073 50%, #7a2a84 50%);
      padding-bottom: 40px; 
      padding-top: 0px;
    }
    @media only screen and (max-width: 991px) {

      .iconbar_spacecol{
        display: none;

      }
  }

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

      .iconbar_full{

        display: none;

      }
    }
    @media only screen and (min-width: 1501px) {

      .iconbar_split{

        display: none;

      }
    }
    
    .iconbar_item{

    text-align: center;
    padding: 10px;
    padding-top: 35px;
    
    font-size: 0.7em;
    line-height: 1.3em;

  }

    .ologybar{
      background-color: #B51F3E;
      padding: 10px;
      text-align: left;
      color: #FFF;
      padding: 10px;
      font-size: 0.9em;
      font-weight: normal;
    }

    .footer{
      background-color: #191919;
      color: #FFF;
      margin-left: auto;
      margin-right: auto;
      border-top:none;
      font-size: 0.8em;
      font-weight: normal;

    }

    .row.intro{
       margin-top: 0rem !important;
       text-align: center;
       padding-bottom: 20px;
    }

    .navbar{
      margin-left: auto;
      margin-right: auto;
    }
    .row{
      /*margin-top: 1.5rem; */
      margin-left: auto;
      margin-right: auto;
    }

  /* Customize container */
  @media (min-width: 64em) {
    .container {

    }
    .supermenu_area{
      max-width: 64rem;
    }
    .navbar{
      max-width: 64rem;
    }
    .row{
      max-width: 64rem;
    }

   
  }
  .container-narrow > hr {
    margin: 2rem 0;
  }

  /* Main marketing message and sign up button */
  .jumbotron {
    text-align: center;
    border-bottom: .05rem solid #e5e5e5;
  }
  .jumbotron .btn {
    padding: .75rem 1.5rem;
    font-size: 1.5rem;
  }

  /* Supporting marketing content */
  .marketing {
    /*margin: 3rem 0;*/
  }
  .marketing p + h4 {
    /*margin-top: 1.5rem;*/
  }

  /* Responsive: Portrait tablets and up */
  @media screen and (min-width: 48em) {
    /* Remove the padding we set earlier */
    .header,
    .marketing,
    .footer {
      padding-right: 0;
      padding-left: 0;
    }
    /* Space out the masthead */
    .header {
      margin-bottom: 2rem;
    }
    /* Remove the bottom border on the jumbotron for visual effect */
    .jumbotron {
      border-bottom: 0;
    }
  }


  .custom-toggler.navbar-toggler {
      border-color: rgb(255,102,203);
  }
  .custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,102,203, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }

  .nav-link{
    color: #000 !important;
    font-weight: bold;
    font-size: 1rem;
  }
  .nav-link.active{
    color: #B51F3E !important;
  }

  h1{

    color: #4E5053;
    font-size: 1.7rem;
    font-weight: bold;

  }
  .pagetitle{

    color: #7a2a84;
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 15px;

  }

  h2{

    color: #4E5053;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 25px;

  }
  .ologyportal_button{
    color: #FFF !important;
    background-color: #B51F3E;
    border-radius: 25px;
    min-width: 200px;
    font-size: 1rem;
    font-weight: bold;
    margin-top: 10px;

  }
.ologyportal_button:hover{
    background-color: #4a101e;

  }


  .ologyportal_button_inverse{
    color: #1F5D95 !important;
    background-color: none;
    border-radius: 25px;
    min-width: 200px;
    font-size: 1rem;
    border-width: 3px;
    border-style: solid;
    border-color: #1F5D95;
    font-weight: bold;
    margin-top: 10px;
  }

  .footimg{
    display: inline-block;
    float: right;
    height: 20px;
    width: auto;
    margin: 10px;
    margin-top: 0px;
    border-style: none;
  }

  .bg-light{
    background-color: #FFF !important;

  }

  /* Style all font awesome icons */
  .fa {
    padding: 20px;
    font-size: 30px;
    width: 50px;
    text-align: center;
    text-decoration: none;
  }

  .fa a{
    text-decoration: none;
    color: #FFF;
  }

  /* Add a hover effect if you want */
  .fa:hover {
    opacity: 0.7;
  }

  /* Set a specific color for each brand */

  /* Facebook */
  .fa-facebook {
    background: #3B5998;
    color: white;
  }

  /* Twitter */
  .fa-twitter {
    background: #55ACEE;
    color: white;
  }

  /* LinkedIn */
  .fa-linkedin {
    background: #0e76a8;
    color: white;
  }


   .profileimg{

    text-align: left;

  }


    @media screen and (min-width: 48em) {

  .profileimg{

    text-align: right;

  }

}

.grantbox{
  display: inline-block;
  margin-bottom: 20px;
  background-color: #CCC;
  font-weight: bold;
  width: 100%;
  height: 100px;
}

#merckgrant{

        padding-left: 15px;
}

.grantholder{
  
}


 @media screen and (max-width: 768px) {
      #merckgrant{
       
      }
      .grantbox{

      }


}