@font-face {
  font-family: "Montara Gothic";
  font-style: normal;
  font-weight: normal;
  src: local("Montara Gothic"), url("/assets/fonts/montara-gothic-5872da32b2ade.woff") format("woff");
}
/* roboto-regular - latin */
@font-face {
  font-display: auto; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/fonts/roboto-v49-latin-regular.woff2") format("woff2"), url("/assets/fonts/roboto-v49-latin-regular.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* roboto-500 - latin */
@font-face {
  font-display: auto; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: url("/assets/fonts/roboto-v49-latin-500.woff2") format("woff2"), url("/assets/fonts/roboto-v49-latin-500.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* roboto-600 - latin */
@font-face {
  font-display: auto; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 600;
  src: url("/assets/fonts/roboto-v49-latin-600.woff2") format("woff2"), url("/assets/fonts/roboto-v49-latin-600.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* roboto-700 - latin */
@font-face {
  font-display: auto; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("/assets/fonts/roboto-v49-latin-700.woff2") format("woff2"), url("/assets/fonts/roboto-v49-latin-700.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
html {
  scroll-behavior: smooth;
}

body {
  background-color: #2B2E83;
  margin: 0;
  display: flex;
  justify-content: center;
  font-size: 14pt;
  color: #333;
  font-family: "Roboto", Helvetica, sans-serif;
  transition: all 10s;
}

#navi {
  width: 98%;
  padding: 0 1%;
  position: fixed;
  height: 60px;
  background: white;
  border-bottom: 10px solid #2B2E83;
  z-index: 10;
}
#navi #page-nav {
  width: 1000px;
  max-width: 100%;
  height: 100%;
  margin: 0 auto;
  display: flex;
}
#navi #page-nav .left {
  width: 30%;
  text-align: left;
  height: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#navi #page-nav .left img {
  max-width: 100%;
  max-height: 40px;
}
#navi #page-nav .right {
  width: 70%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 100%;
}
#navi #page-nav a {
  width: auto;
  margin: 0 1% 0 2%;
  color: #2B2E83;
  font-weight: 600;
  font-size: 1.1rem;
  text-decoration: none;
  transition: all 0.5s;
  border-bottom: 4px solid;
  border-bottom-color: transparent;
}
#navi #page-nav a:hover, #navi #page-nav a.active {
  border-bottom-color: #A86515;
}

a.target {
  position: absolute;
  left: 0;
  top: -60px;
}

#content-wrapper {
  width: 1000px;
  padding: 10px;
  max-width: 100%;
  overflow: hidden;
}

p, ul {
  font-size: 0.9rem;
}

section {
  position: relative;
}

section {
  width: 96%;
  padding: 2%;
  margin: 2% 0;
  background: #fff;
  border-radius: 5px;
  /*h1 {
    font-size: 2rem;
    line-height: 4rem;
    color: colors.$lehmorange;

    img {
      width: 100%;
      max-width: 600px;
      display: block;
      margin: 0 auto;
    }
  }*/
}
section:first-of-type {
  padding-top: 70px;
}
section h1,
section h2,
section h3,
section h4 {
  color: #2B2E83;
  width: 100%;
  text-align: center;
  font-family: "Montara Gothic", "Times New Roman", Times, serif;
}
section p, section ul {
  width: 100%;
  max-width: 600px;
  margin: 10px auto;
}
section h2 {
  font-size: 2rem;
}
section h3 {
  color: #A86515;
  font-size: 1.5rem;
}
section h4 {
  font-size: 1.1rem;
  color: #A86515;
  text-align: left;
  margin: 2rem 0 1rem;
  font-family: "Roboto";
}

.opener__title {
  color: #2B2E83;
  font-size: 7rem;
  margin-bottom: 0;
}
.opener__subtitle {
  color: #2B2E83;
  font-size: 2rem;
  margin-top: -0.2rem;
}
.opener__name {
  color: #A86515;
  margin-top: 0.5rem;
}

.headerlogo {
  color: #2B2E83;
  font-family: "Montara Gothic", "Times New Roman", Times, serif;
  font-size: 2rem;
}

.largeText {
  font-weight: 400;
  font-size: 1.7rem;
  width: 100%;
}

.smallerText {
  font-size: 0.8rem;
}

.centeredText {
  text-align: center;
}

.highlight {
  color: #A86515;
  font-weight: bold;
}

.quoteBox .quote {
  font-style: italic;
  text-align: center;
  font-size: 0.9rem;
  position: relative;
  padding: 2rem 0;
}
.quoteBox .quote::after, .quoteBox .quote::before {
  content: '"';
  font-size: 5rem;
  position: absolute;
  color: #A86515;
  font-weight: bold;
  font-family: "Times New Roman", Times, serif;
  opacity: 0.4;
}
.quoteBox .quote::after {
  right: 0px;
}
.quoteBox .quote::before {
  left: -50px;
}
.quoteBox .author {
  font-weight: bold;
  font-size: 0.9rem;
  color: #2B2E83;
  width: 90%;
  text-align: right;
  padding-right: 10%;
}

.taskAnker {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.taskAnker .imgTask {
  font-weight: bold;
  color: #2B2E83;
  width: 96%;
  height: 200px;
  min-width: 200px;
  margin: 2%;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 5px;
}
.taskAnker .imgTask span {
  opacity: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 1s;
  background: #fff;
}
.taskAnker .imgTask span:hover {
  opacity: 0.85;
  transition: opacity 0.5s;
}

.taskSection {
  width: 100%;
  margin: 2rem 0;
  box-sizing: content-box;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 5px;
}
.taskSection .content {
  background-color: rgba(255, 255, 255, 0.8);
  height: calc(100% - 2rem);
  width: calc(100% - 2rem);
  z-index: 0;
  padding: 1rem;
  margin: 0;
}
.taskSection .content .imgContainer {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
  align-content: flex-start;
  flex-wrap: wrap;
}
.taskSection .content .imgContainer img {
  margin: 1rem 1%;
  max-width: 31%;
  align-self: center;
  max-height: 250px;
  min-width: 150px;
}

#sec-about .aboutContent {
  display: flex;
  width: 100%;
  margin: 0 auto;
  max-width: 600px;
}
#sec-about .aboutContent img {
  width: 40%;
  margin-right: 5%;
  max-width: 200px;
}
#sec-about .aboutContent div {
  width: 55%;
}
#sec-about .aboutContent div h2 {
  text-align: left;
}

.aroundBox {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ddd;
}
.aroundBox:last-of-type {
  border-bottom: none;
}
.aroundBox img {
  width: 30%;
  margin-right: 5%;
  max-height: 70px;
}
.aroundBox .aroundContent {
  width: 65%;
}
.aroundBox .aroundContent p {
  margin-left: 0;
}
.aroundBox .aroundContent a {
  font-size: 0.9rem;
  color: #2B2E83;
  font-weight: bold;
}
.aroundBox .aroundContent .title {
  font-size: 1.1rem;
  color: #A86515;
  text-align: left;
  margin: 2rem 0 1rem;
  font-family: "Roboto";
  font-weight: 500;
}

.iconBlock {
  display: flex;
  justify-content: space-around;
  width: 100%;
  max-width: 600px;
  margin: 2rem auto;
}
.iconBlock .iconBox {
  width: 31%;
  margin: 0 1%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.iconBlock .iconBox span {
  font-size: 0.9rem;
  font-weight: 500;
}
.iconBlock .iconBox img {
  max-height: 50px;
  width: 100%;
  margin: 0 auto 0.5rem;
  color: #A86515;
}

form {
  width: 100%;
  max-width: 600px;
  border: 1px solid #dddddd;
  padding: 1rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
form div {
  width: 100%;
  max-width: 400px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
form div label {
  max-width: 40%;
  text-align: right;
}
form div input,
form div textarea {
  width: 60%;
  margin: 0.5rem;
  height: 25px;
}
form div textarea {
  height: 100px;
}
form button[type=submit] {
  background: #A86515;
  box-shadow: none;
  border: none;
  height: 30px;
  width: 100%;
  max-width: 200px;
  color: white;
  font-weight: bold;
  align-self: center;
  transition: background-color 0.2s;
}
form button[type=submit]:hover {
  background-color: orange;
  transition: background-color 0.2s;
}

footer {
  position: absolute;
  margin: 0 0 20px;
  padding-bottom: 10px;
  left: 0;
  border-radius: 0;
  background: #2B2E83;
  color: white;
  text-align: center;
  padding-top: 0;
  width: 100%;
}
footer a:link,
footer a:visited,
footer a:hover,
footer a:active {
  color: white;
  text-decoration: none;
}

.lightbox-wrapper {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 1004; /*This is appended before the actual lightbox is faded in so that elements with
   high z-index values (e.g. navbar) don't cover lightbox during fadein*/
}

.lightbox-photo:hover {
  cursor: pointer;
}

.expanded {
  position: fixed;
  max-height: 100%;
  max-width: 100%;
  height: 600px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1002;
}

/*.caption {
    position:fixed;
    background: black;
    color:white;
    padding:8px;
    border-radius:5px;
    font-size:14px;
    bottom:3%;
    left:50%;
    transform:translateX(-50%);
    z-index:1003;
}*/
.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  background-color: black;
  height: 100%;
  width: 100%;
  opacity: 0.85;
  z-index: 1001;
}

/*# sourceMappingURL=style.css.map */