/* FeM page layout. Preserve breakpoint and cascade order when editing. */
html,
body {
  font-size: 14px;
}
body {
  background: white;
}
img {
  max-width: 100%;
  height: auto;
}
nav ul {
  list-style-type: none;
  padding-left: 0;
  margin: 0;
}
h1 {
  color: var(--fem-brand-color, #00377c);
  border-bottom: 2px solid var(--fem-brand-color, #00377c);
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}
input[type="checkbox"],
input[type="radio"] {
  vertical-align: inherit;
}
td,
th {
  padding: 2px 4px;
}
b,
strong {
  letter-spacing: 0.04em;
}
header:where(.fem-page *) {
  margin-left: -1rem;
  margin-right: -1rem;
  padding: 0.75rem 1rem;
  background: var(--fem-header-background, #ffcc00);
  background: linear-gradient(to bottom, #ffdd52 0%, #ffcc00 100%);
}
header:where(.fem-page *):before,
header:where(.fem-page *):after {
  content: " ";
  display: table;
}
header:where(.fem-page *):after {
  clear: both;
}
header:where(.fem-page *) .logo_mobile {
  display: block;
  float: left;
  width: 156px;
  line-height: 35px;
}
header:where(.fem-page *) .logo,
header:where(.fem-page *) .people {
  display: none;
}
header:where(.fem-page *) .menuBtn {
  float: right;
  line-height: 35px;
  font-size: 1.5rem;
  color: var(--fem-brand-color, #00377c);
}
header:where(.fem-page *) .menuBtn:hover {
  cursor: pointer;
}
.mainnav {
  margin-left: -1rem;
  margin-right: -1rem;
  background: #dee1e4;
}
.mainnav:before,
.mainnav:after {
  content: " ";
  display: table;
}
.mainnav:after {
  clear: both;
}
.mainnav.open {
  display: block;
}
main {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.left {
  display: none;
}
.breadcrumbs ul {
  list-style-type: none;
  padding-left: 0;
  font-size: 0;
  margin-bottom: 1rem;
}
.breadcrumbs li {
  display: inline-block;
  font-size: 1rem;
  padding-right: 0.4rem;
  padding-bottom: 0.4rem;
}
.breadcrumbs li:before {
  font-family: "iconfont";
  color: var(--fem-brand-color, #00377c);
  content: "";
  padding-right: 0.4rem;
}
.breadcrumbs li:first-child:before {
  content: "";
}
article h1:first-child {
  margin-top: 0;
}
.fem-site-footer {
  margin-left: -1rem;
  margin-right: -1rem;
  background: #dee1e4;
}
.fem-site-footer:before,
.fem-site-footer:after {
  content: " ";
  display: table;
}
.fem-site-footer:after {
  clear: both;
}
.footernav {
  border-top: 1px solid rgba(0, 55, 124, 0.2);
}
.footernav:before,
.footernav:after {
  content: " ";
  display: table;
}
.footernav:after {
  clear: both;
}
.footernav ul {
  margin: 0;
  float: right;
}
.footernav ul:before,
.footernav ul:after {
  content: " ";
  display: table;
}
.footernav ul:after {
  clear: both;
}
.footernav li {
  float: left;
}
.footernav a {
  display: inline-block;
  padding: .5rem 1rem;
}
@media (max-width: 767px) {
  .mainnav {
    display: none;
    background: #fffdf6;
    border-top: 1px solid var(--fem-brand-color, #00377c);
    border-bottom: 1px solid var(--fem-brand-color, #00377c);
  }
  .mainnav > ul ul {
    display: none;
  }
  .mainnav a {
    background: #f0f0f0;
    display: block;
  }
  .mainnav a .icon {
    float: right;
    font-size: 1.2rem;
    line-height: 1rem;
  }
  .mainnav a:hover {
    background: #c2c7cd;
  }
  .mainnav a:hover,
  .mainnav a:active,
  .mainnav a:focus {
    text-decoration: none;
  }
  .mainnav li.active > a {
    background: var(--fem-brand-color, #00377c);
    background: linear-gradient(to bottom, #094fa6 0%, #3066a3 100%);
    color: white;
  }
  .mainnav li.active > ul {
    display: block;
  }
  .mainnav > ul>li > a {
    padding: 0.75rem 1rem;
    font-weight: bold;
  }
  .mainnav > ul>li + li {
    border-top: 1px solid rgba(0, 55, 124, 0.5);
  }
  .mainnav > ul>li>ul>li > a {
    padding: 0.5rem 2rem;
    padding-right: 1rem;
  }
  .mainnav > ul>li>ul>li.active > a {
    background: #538ccc;
  }
  .mainnav > ul>li>ul>li>ul>li > a {
    padding: 0.5rem 3rem;
    padding-right: 1rem;
  }
  .mainnav > ul>li>ul>li>ul>li.active > a {
    background: #8eb4de;
  }
  .mainnav .langMenu {
    background: #f0f0f0;
    border-top: 1px solid rgba(0, 55, 124, 0.5);
  }
  .mainnav .langMenu ul {
    font-size: 0;
    padding: 0 1rem;
    text-align: center;
  }
  .mainnav .langMenu li {
    display: inline-block;
  }
  .mainnav .langMenu a {
    line-height: 1rem;
    padding: 0.75rem 2rem;
  }
}
@media screen and (min-width: 768px) {
  html,
  body {
    font-size: 15px;
  }
  body {
    background: #f0f0f0;
    overflow-y: scroll;
  }
  h1 {
    font-size: 2.074rem;
  }
  h2 {
    font-size: 1.728rem;
  }
  h3 {
    font-size: 1.44rem;
  }
  h4 {
    font-size: 1.2rem;
  }
  h5 {
    font-size: 1rem;
  }
  h6 {
    font-size: 0.833rem;
  }
  .container {
    margin-top: 1rem;
    margin-bottom: 1rem;
    background: white;
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.4);
    overflow: hidden;
  }
  header:where(.fem-page *) {
    position: relative;
    padding: 2rem;
    background: var(--fem-header-background, #ffcc00);
    background: linear-gradient(to bottom, #ffe787 0%, #ffcc00 100%);
  }
  header:where(.fem-page *):before,
  header:where(.fem-page *):after {
    content: " ";
    display: table;
  }
  header:where(.fem-page *):after {
    clear: both;
  }
  header:where(.fem-page *) .people {
    display: block;
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    width: 35%;
    max-width: 380px;
    opacity: 0.3;
  }
  header:where(.fem-page *) .logo_mobile {
    display: none;
  }
  header:where(.fem-page *) .logo {
    display: block;
    width: 60%;
    max-width: 600px;
    float: right;
    text-align: right;
  }
  header:where(.fem-page *) .menuBtn {
    display: none;
  }
  .mainnav {
    font-weight: bold;
    letter-spacing: 0.5px;
    border-top: 1px solid rgba(0, 55, 124, 0.2);
    border-bottom: 1px solid rgba(0, 55, 124, 0.2);
  }
  .mainnav > ul {
    float: left;
    margin: 0;
  }
  .mainnav > ul:before,
  .mainnav > ul:after {
    content: " ";
    display: table;
  }
  .mainnav > ul:after {
    clear: both;
  }
  .mainnav > ul ul {
    display: none;
  }
  .mainnav li {
    float: left;
  }
  .mainnav .active > a {
    background-color: #11509e;
    background: linear-gradient(to bottom, #094fa6 0%, #3066a3 100%);
    color: #ffcc00;
  }
  .mainnav a {
    display: inline-block;
    padding: .5rem 1rem;
  }
  .mainnav a:focus,
  .mainnav a:hover,
  .mainnav a:active {
    text-decoration: none;
  }
  .mainnav a:hover {
    background: var(--fem-brand-color, #00377c);
    background: linear-gradient(to bottom, #0845a8 0%, #1f5596 100%);
    color: #ffcc00;
  }
  .mainnav .icon {
    display: none;
  }
  .mainnav .langMenu {
    float: right;
  }
  .mainnav .langMenu ul > img {
    display: none;
  }
  main {
    margin-left: -1rem;
    margin-right: -1rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  
  
  main:before,
  main:after {
    content: " ";
    display: table;
  }
  main:after {
    clear: both;
  }
  .left {
    display: block;
    position: relative;
    min-height: 1px;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .sidenav {
    margin-right: -1rem;
    border-top: 1px solid rgba(0, 55, 124, 0.2);
    border-bottom: 1px solid rgba(0, 55, 124, 0.2);
    background: white;
  }
  .sidenav a {
    display: block;
    word-wrap: break-word;
  }
  
  .sidenav a {
    background: #f0f0f0;
    display: block;
  }
  .sidenav a .icon {
    float: right;
  }
  .sidenav a:hover {
    background: #d7d7d7;
  }
  .sidenav a:hover,
  .sidenav a:active,
  .sidenav a:focus {
    text-decoration: none;
  }
  .sidenav li.active > a {
    background: var(--fem-brand-color, #00377c);
    background: linear-gradient(to bottom, #094fa6 0%, #3066a3 100%);
    color: white;
  }
  .sidenav > ul>li > a {
    padding: 0.5rem 1rem;
    font-weight: bold;
    letter-spacing: 0.5px;
  }
  .sidenav > ul>li + li {
    margin-top: 1px;
  }
  .sidenav > ul>li>ul>li > a {
    padding: 0.25rem 2rem;
    padding-right: 1rem;
  }
  .sidenav > ul>li>ul>li.active > a {
    background: #538ccc;
  }
  .breadcrumbs {
    display: none;
  }
  .center {
    position: relative;
    min-height: 1px;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .center > article {
    padding: 1rem;
    border: 1px dotted #ffcc00;
    background-color: #fffdf6;
  }
  .footer {
    margin-left: -1rem;
    margin-right: -1rem;
    background: #dee1e4;
  }
  .footer:before,
  .footer:after {
    content: " ";
    display: table;
  }
  .footer:after {
    clear: both;
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .left {
    float: left;
    width: 25%;
  }
}
@media screen and (min-width: 768px) and (min-width: 992px) {
  .left {
    float: left;
    width: 16.66666667%;
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .center {
    float: left;
    width: 75%;
  }
}
@media screen and (min-width: 768px) and (min-width: 992px) {
  .center {
    float: left;
    width: 83.33333333%;
  }
}
@media screen and (min-width: 992px) {
  .container {
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
}
@media screen and (min-width: 1200px) {
  header:where(.fem-page *) {
    padding: 3rem;
  }
  header:where(.fem-page *) .people {
    left: 2rem;
    bottom: 2rem;
  }
  .left {
    padding-left: 2rem;
  }
  .center {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  .center > article {
    padding: 2rem;
    padding-top: 1.5rem;
  }
}

/* Historic final overrides. Keep their order: later declarations are intentional. */

@media screen and (min-width: 768px) {
  header:where(.fem-page *) {
    background: var(--fem-header-background, #ffcc00);
  }
  body > .container {
    margin-top: 0rem;
    margin-bottom: 0rem;
  }
  .mainnav .active > a {
    background: #3066a3;
  }
  .sidenav > ul > li > a {
    padding: 0.7rem 1rem;
    background: #fff;
  }
  .center > article {
    border: none;
    background-color: transparent !important;
  }
  h1 {
    font-size: 2.3rem;
  }
  .mainnav {
     border:none !important;
  }
  .mainnav a {
    /* padding: .5rem 1rem; */
    padding: 0.7rem 1.7rem;
    color: white;
  }
  .sidenav {
    border: none !important;
  }
  .sidenav a {
    background: #fff;
  }
}

@media (min-width: 992px) {
  .container {
    width: 100%;
    min-width: 0px;
  }
}

@media (min-width: 768px) {
  .container {
    width: 100%;
  }
}

.container {
  max-width: var(--fem-content-max-width, 2160px);
}

@media screen and (min-width: 992px) {
  .container {
    margin-top: 0rem;
    margin-bottom: 0rem;
  }
}

@media screen and (min-width: 1200px) {
  header:where(.fem-page *) {
    /* padding: 3rem; */
    padding: 2.5rem 3rem;
  }
}

.footernav {
  border: none;
}

.fem-site-footer {
  background: var(--fem-brand-color, #00377c);
}

.footernav a {
  color: #e0e0e0;
}

h1 {
  border-bottom: none;
  padding-bottom: 0.8rem;
  font-weight: bold;
  margin-top: 2rem;
}

.mainnav {
  background: var(--fem-brand-color, #00377c);
}

.footernav {
  padding: 2rem;
}

.container > main:nth-child(3) {
  background: var(--fem-page-background, #f7f7f7);
}

main > .left {
  padding-top: 0.5rem;
  background: white;
  padding-bottom: 0.5rem;
}

header:where(.fem-page *) {
  /* background: linear-gradient(to bottom, #ffdd52 0%, #ffcc00 100%); */
  background: var(--fem-header-background, #ffcc00);
}

@media (max-width: 767px) {
  .mainnav {
    /* border-bottom: 1px solid var(--fem-brand-color, #00377c); */
    border-bottom: 3px solid var(--fem-brand-color, #00377c);
  }
  .mainnav li.active > a {
    /* background: linear-gradient(to bottom, #094fa6 0%, #3066a3 100%); */
    background: #094fa6;
  }
}

.mainnav.open {
  position: fixed;
  width: 100%;
  top: 56px;
  z-index: 600;
}

.container > header:where(.fem-page *):nth-child(1) {
  position: sticky;
  top: 0;
}

.mainnav {
  max-width: 100vw;
}


.container {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.container > main:nth-child(3) {
  flex-grow: 1;
}

.gallery .gallery-image .caption {
  text-align: center;
  color: var(--fem-brand-color, #00377c);
  font-weight: bold;
  padding-top: 3px;
}

.gallery .gallery-image img {
  width: 100%  
}


header:where(.fem-page *) .people {
    /* bottom: 2rem; */
    top: 50%;
    transform: translateY(-50%) !important;
  }

header:where(.fem-page *) .people img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

body {
  background: var(--fem-page-background, #f7f7f7) !important;
}
/* Normal page scrolling, previously a compatibility override. */
.fem-site-header { position: relative !important; top: auto !important; }