/* <editor-fold> general settings */
body {
  padding-top: 50px;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  color: #231f20;
  line-height: 1.8em;
  min-width: 350px;
}

a {
  color: #AC2F80;
  font-weight: 600;
}

a:hover {
  color: #0B4C76;
  text-decoration: none;
}

h1, h2, h3, h4, h5 {
  font-weight: 600;
  color: #003a66;
  page-break-after: avoid;
}

h2 {
  text-align: center;
  margin-bottom: 4vh;
}

h3 {
  font-size: 1.3em;
  margin: 4vh 0 2vh 0;
}

h4 {
  margin-top: 1.5em;
  font-size: 1.1em;
}

h5 {
  margin-top: 1.5em;
}

ul {
  padding-left: 1.3em;
}

li {
  margin-bottom: 1em;
}

.anchor {
  display: block;
  position: relative;
  top: -50px;
}

.img-responsive {
  max-height: 100vh;
  width: 100%;
  object-fit: cover;
}

.section-wrapper {
  padding: 2vh 0 4vh 0;
}

.has-fill {
  background-color: #f4f4f4;
}

.vspace {
  margin-top: 3vh;
}

.vspace2 {
  margin-top: 6vh;
}

/* </editor-fold> */

/* <editor-fold> navbar */

/* navbar */
.navbar-default {
  position: fixed;
  background-color: #FFFFFF;

  border: 0;
  -webkit-box-shadow: 0px -1px 5px 0px rgba(0, 0, 0, 0.32);
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.32);
}

.navbar-default .navbar-collapse {
  max-height: 80%;
}

.navbar-default .dropdown-menu li {
  margin-bottom: 0;
}


/* <editor-fold> navbar title */
.navbar-default .navbar-brand {
  font-size: 24px;
  padding: 4px 0;
  height: 40px;
  margin: 10px 0 0 -15px;
}

.navbar-default .navbar-brand a {
    color: #0B4C76;
}

.navbar-default .navbar-brand a:hover,
.navbar-default .navbar-brand a:focus {
    color: #003a66;
}
/* </editor-fold> */

/* <editor-fold> navbar Link */
.navbar-default .navbar-nav > li > a {
    color: #231f20;
    padding: 0;
    font-weight: 300;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #AC2F80;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: #0B4C76;
    background-color: transparent;
    border-bottom: 2px solid #0B4C76;
    font-weight: normal;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: #AC2F80;
    background-color: transparent;
}
/* </editor-fold> */

/* <editor-fold> navbar Caret */
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #58585a;
    border-bottom-color: #58585a;
}
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #003a66;
    border-bottom-color: #003a66;
}
.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret,
.navbar-default .navbar-nav > .open > a:focus .caret {
    border-top-color: #AC2F80;
    border-bottom-color: #AC2F80;
}
/* </editor-fold> */

/* <editor-fold> navbar Mobile version */
.navbar-default .navbar-toggle {
    border-color: #231f20;
    margin: 8px 0;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    border-color: #AC2F80;
    background-color: transparent;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #231f20;
}
.navbar-default .navbar-toggle:hover .icon-bar,
.navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #AC2F80;
}
/* </editor-fold> */

/* <editor-fold> language bar */
  .languages {
    font-size: 12px;
    padding: 5px 0 8px 30px;
    margin-bottom: 0;
    border-bottom: 1px solid #f0f0f0;
  }

  .languages li {
    padding: 0;
    margin: 0;
  }

  .languages li:not(:first-child):before {
    content: '|';
    padding: 0px 10px;
  }
/* </editor-fold> */

/* </editor-fold> */

/* <editor-fold> footer */
.footer {
  padding: 25px 0;
  width: 100%;
  font-size: 0.8em;
  color: #717171;
  background-color: #131313;
}

.footer-social a {
  font-size: 1.5em;
  color: #717171;
}

.footer-social a:hover, .footer-social a:active {
  color: #ac2f80;
}

/* <editor-fold> toTop */
#toTop {
  box-sizing: border-box;
  width: 30px;
  height: 30px;

  position: fixed;
  right: 20px;
  bottom: 20px;

  color: #003a66;
  cursor: pointer;
  font-size: 24px;
  text-align: center;

  border: 1px solid #003a66;
}

#toTop:hover {
  color: #fff;
  background-color: #003a66;
}
/* </editor-fold> */

/* </editor-fold> */

.twitter {
  overflow: hidden;
}

/*
.articles li:nth-child(n+6), .videos li:nth-child(n+5) {
  display: none;
}
*/


/* <editor-fold> reflections */
.reflections {
  padding: 0;
  display: flex;
  list-style: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.reflections h3 {
  margin: 0 0 0.5em 0;
  font-size: 1.2em;
}

.reflections p {
  margin: 0;
}

.reflections li {
  padding: 20px 10px;
  margin: 1vh 0.5%;
  display: inline-block;
  background-color: #ffffff;
  border:1px solid #0B4C76;
  box-sizing: border-box;
  width: 95%;
  cursor: pointer;

}

.reflections li:hover {
  background-color: #003a66;
}

.reflections li:hover p, .reflections li:hover h3 {
  color: #fff;
}
/* </editor-fold> */


/* <editor-fold> endorsements */

.endorsements {
  margin: 0;
  padding: 0;

  display: flex;
  list-style: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.endorsements h3 {
  margin-top: 1em;
  text-align: center;
}

.endorsements p {
  margin: 0;
  padding: 1em;
  font-weight: 600;
}


.endorsements li {
  margin: 0.5em;
  flex: 1 0 340px;
  background-color: #ffffff;
  border:1px solid #0B4C76;
  cursor: pointer;
}

.endorsements li:hover {
  background-color: #003a66;
}

.endorsements li:hover p, .endorsements li:hover h3 {
  color: #fff;
}

.endorser {
  background-color: #ffffff;
  padding: 0.5em;
  margin-bottom: 6vh;
}


/* </editor-fold> */


/* <editor-fold> questions */

.questions li {
  display: block;

  border: 1px solid #ccc;
}

.questions li.active {
  background-color: #fff;
}

.questions li h3 {
  font-size: 1em;
  line-height: 1.5em;
  font-weight: 400;
  padding: 1em;

  margin: 0;
  cursor: pointer;
}

.questions li.in h3 {
  margin-bottom: 1em;
}

.questions h3 b {
  font-size: 1.2em;
  font-weight: 600;
}

.questions li p {
  display: none;
  padding: 0 1em;
}

.questions li.active p {
  display: block;
}

/* </editor-fold> */


/* <editor-fold> video-popup */
.video-popup {
  position: relative;
  margin: 15px 0;
}

.video-popup-link {
  position: absolute;
  top: 50%;
  width: 100%;
  margin-top: -16px;
  text-align: center;
}

.video-popup-link i {
  display: inline-block;
  padding: 16px 24px;
  font-size: 24px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.35);
}

.video-popup:hover .video-popup-link i {
  background-color: #003a66;
}
/* </editor-fold> */


/* <editor-fold> brochure */

.brochure img {
  margin-bottom: 2em;
}
/* </editor-fold> */


/* <editor-fold> about, priorities  */

.about-section,
.priority-section {
  border: 1px solid #f4f4f4;
  background-color: #ffffff;
  margin-bottom: 1em;
}

.about-section.active,
.priority-section.active {
  border-color: #003a66;
}

.about-section h3,
.priority-section h3 {
  margin: 0;
  padding: 1em;
}

.about-section h3:hover,
.priority-section h3:hover,
.about-section.active h3,
.priority-section.active h3 {
  background-color: #003a66;
  color: #fff;
}

.about-section .about-section-content,
.priority-section .priority-content {
  display: none;
}

.about-section.active {
  display: block;
}

.about-section.active .about-section-content,
.priority-section.active .priority-content {
  padding: 1em;
  display: block;
}

.priority-section img {
  margin-bottom: 1em;
}

/* <editor-fold> about */

.about-details-nav {
  padding: 0;
}

.about-details-nav li {
  border: 1px solid #ddd;

  padding: 0 0 0 0;
  margin: 0;
}

.about-details-nav li.active {
  background-color: #ffffff;
}

.about-details-content {
  padding: 0;
}

/* <editor-fold> career-position */
.career-position {
  margin-bottom: 3vh;
  cursor: pointer;
}

.career-position > * {
  display: none;
}

.career-position.active > * {
  display: block;
}

.career-position h4 {
  display: block;
}

.career-position .period {
  display: block;
  margin-top: -1vh;
  font-weight: 600;
}
/* </editor-fold> */

/* </editor-fold> */

/* <editor-fold> priority tabs */

.priorities-nav {
  display: block;
  list-style: none;
  padding: 0 1em;
  margin: 4vh 0 1vh 0;
}

.priorities-nav li {
  display: table-cell;
  border: 1px solid #ccc;
  text-align: center;
  vertical-align: middle;

  width: 25%;
  cursor: pointer;
}

.priorities-nav li:not(:first-child) {
  border-left: 0;
}

.priorities-nav a {
  display: block;
  font-weight: 400;
  color: #231f20;
  padding: 0.5em 1em;
  width: 100%;
  height: 100%;
}

.priorities-nav li.active,
.priorities-nav li:hover {
  background-color: #003a66;
}

.priorities-nav li.active a,
.priorities-nav a:hover {
  color: #fff;
}

.priorities-nav a:active,
.priorities-nav a:focus,
.priorities-nav a:visited {
  text-decoration: none;
}

/* </editor-fold> */

/* </editor-fold> */


@media(min-width:768px){
  body {
    padding-top: 90px;
  }

  .anchor {
    top: -90px;
  }

  .navbar-default {
    height: 90px;
  }

  .navbar-default .navbar-brand {
    font-size: 30px;
    line-height: 24px;
    margin-top: 16px;
  }

  .navbar-default .navbar-nav {
    margin-right: 0;
  }

  .navbar-default .navbar-nav > li > a {
    margin: 15px 0 0 15px;
    font-size: 12px;
  }

  .video-popup {
    float: right;
    width: 50%;
    margin: 10px;
  }


  .about-details {
    margin-top: 4vh;
    border: 1px solid #003a66;
    padding: 0;
  }

  .about-section,
  .priority-section {
    display: none;
    margin-bottom: 0;
  }

  .about-section.active {
    border: 0;
  }

  .priority-section {
    background-color: transparent;
    border: 0;
  }

  .reflections li {
    width: 48%
  }

  .endorsements li {
    max-width: 49%
  }
}

@media(min-width:992px){
  body {
    padding-top: 100px;
  }

  .anchor {
    top: -100px;
  }

  .navbar-default {
    height: 100px;
  }

  .navbar-default .navbar-brand {
    font-size: 36px;
    line-height: 30px;
    margin-top: 16px;
  }

  .navbar-default .navbar-nav > li > a {
    margin: 20px 0 0 25px;
    padding-bottom: 5px;
    font-size: 14px;
  }

  .reflections li {
    width: 31%
  }
}

@media(min-width:1200px){
  .reflections li {
    width: 24%
  }

  .endorsements li {
    max-width: 32%
  }
}