/*
    -------------------------------------------------------------------------
    Calendar.js Website - Variables
    -------------------------------------------------------------------------
*/
:root {
  --calendar-js-color-dark: #282828;
  --calendar-js-color-light: #F5F5F5;
  --calendar-js-color-white: #FFFFFF;
  --calendar-js-color-hover: #fac863;
  --calendar-js-color-link: #115EDB;
  --calendar-js-color-nav-link-hover: #575555;
  --calendar-js-color-text: #515151;
  --calendar-js-color-header: #212529;
  --calendar-js-color-darker-grey: #E3EEEE;
  --calendar-js-color-grey: #EEEEEE;
  --calendar-js-border-radius: 0.375rem;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Body
    -------------------------------------------------------------------------
*/
html, body {
  margin: 0;
  height: 100%;
  font: 14px/1.6 poppins, Helvetica, sans-serif, serif;
  color: var(--calendar-js-color-text);
}
@media (min-width: 992px) {
  html, body {
    font: 16px/1.6 poppins, Helvetica, sans-serif, serif;
  }
}

body div.layout {
  display: flex;
  flex-direction: column;
  padding: 0;
  min-height: 100%;
}
body div.layout div.container-main {
  flex: 1 0 auto !important;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
  padding: 15px;
  padding-left: 25px;
  padding-right: 25px;
  width: 100%;
  overflow-x: auto;
  animation: fade-in-effect 1s;
}
body div.layout ins.adsbygoogle {
  display: block;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Header
    -------------------------------------------------------------------------
*/
body div.layout header {
  background-color: var(--calendar-js-color-dark);
  color: var(--calendar-js-color-light);
}
body div.layout header nav div.navigation-links {
  margin-left: auto;
  margin-right: auto;
  max-width: 1260px;
  text-wrap: nowrap;
}
@media (min-width: 992px) {
  body div.layout header nav div.navigation-links {
    padding: 15px;
  }
}
body div.layout header nav div.navigation-links div.navigation-menu-links {
  background-color: var(--calendar-js-color-dark);
  color: var(--calendar-js-color-light);
  position: absolute;
  left: 0;
  width: 100%;
  padding: 15px;
  z-index: 100;
}
@media (min-width: 992px) {
  body div.layout header nav div.navigation-links div.navigation-menu-links {
    position: inherit;
    padding: 0;
    z-index: 0;
  }
}
body div.layout header nav div.navigation-links a.title {
  display: inline-flex;
  align-items: center;
  margin-right: 40px;
  font-size: 28px;
  font-weight: 900;
}
body div.layout header nav div.navigation-links a.title img {
  width: 35px;
  margin-right: 15px;
}
body div.layout header nav div.navigation-links a {
  display: inline-flex;
  align-items: center;
  padding: 15px;
  margin: 5px;
  color: var(--calendar-js-color-light);
  text-decoration: none;
  transition: all 0.3s ease-in-out;
  border-radius: var(--calendar-js-border-radius);
}
body div.layout header nav div.navigation-links a span.material-symbols-outlined {
  margin-right: 9px;
}
body div.layout header nav div.navigation-links a:hover:not(.title), body div.layout header nav div.navigation-links a.active-nav-link {
  background-color: var(--calendar-js-color-hover);
  color: var(--calendar-js-color-dark);
}
body div.layout header nav div.navigation-links a.download-nav-link {
  font-weight: 700;
}
body div.layout header nav div.navigation-links div.end-links {
  margin-left: auto;
  order: 2;
}
body div.layout header nav img.navigation-menu-button {
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  width: 40px;
  margin-top: 22px;
  margin-right: 15px;
}
body div.layout header nav img.navigation-menu-button:hover {
  opacity: 0.7;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Header Background
    -------------------------------------------------------------------------
*/
body div.layout div.header-background {
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 25px;
  padding-right: 25px;
  background: linear-gradient(rgba(238, 238, 238, 0.7), rgba(238, 238, 238, 0.7)), url(/images/top_header.jpg);
  background-size: cover;
  background-position: center;
  border-bottom-left-radius: 50% 85px;
  border-bottom-right-radius: 50% 85px;
  margin-bottom: 40px;
  overflow: hidden;
  text-align: center;
  color: var(--calendar-js-color-header);
  animation: fade-in-effect 1s;
}
@media (min-width: 992px) {
  body div.layout div.header-background {
    padding-top: 150px;
  }
}
body div.layout div.header-background h1 {
  font-weight: 900;
}
body div.layout div.header-background h1,
body div.layout div.header-background p {
  margin-left: auto;
  margin-right: auto;
  max-width: 700px;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Content
    -------------------------------------------------------------------------
*/
body div.layout div.container-main h2 {
  font-weight: 900;
  font-size: 1.6rem;
  margin-bottom: 20px;
}
body div.layout div.container-main h3 {
  font-weight: 900;
  font-size: 1.3rem;
  margin-bottom: 20px;
}
body div.layout div.container-main h4 {
  font-weight: 900;
  font-size: 1rem;
  margin-top: 20px;
}
body div.layout div.container-main section {
  margin-top: 6rem;
}
body div.layout div.container-main section:first-child {
  margin-top: 0;
}
body div.layout div.container-main code {
  background-color: gray;
  border-radius: var(--calendar-js-border-radius);
  padding: 5px;
  padding-left: 8px;
  padding-right: 8px;
  color: white;
  margin-right: 5px;
  margin-bottom: 3px;
}
body div.layout div.container-main a {
  text-decoration: none;
  transition: all 0.3s ease-in-out;
  font-weight: 600;
  color: var(--calendar-js-color-link);
}
body div.layout div.container-main a:hover {
  text-decoration: underline;
}
body div.layout div.container-main ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
body div.layout div.container-main ul li {
  margin-top: 4px;
  margin-bottom: 4px;
}
body div.layout div.container-main div.header-divider,
body div.layout div.container-main div.header-divider-smaller {
  background-color: var(--calendar-js-color-link);
  display: inline-block;
  border-radius: 3px;
  height: 6px;
}
body div.layout div.container-main div.header-divider {
  width: 70px;
  margin-bottom: 50px;
}
body div.layout div.container-main div.header-divider-smaller {
  width: 40px;
  margin-bottom: 10px;
}
body div.layout div.container-main div.list-container ul {
  list-style-type: disc;
  list-style-position: inside;
}
body div.layout div.container-main div.list-container ul li {
  overflow-wrap: anywhere;
}
body div.layout div.container-main div.image-description span.material-symbols-outlined {
  font-size: 50px;
  margin-bottom: 10px;
  font-weight: 900;
  color: var(--calendar-js-color-link);
}
body div.layout div.container-main div.image-description padding {
  margin-bottom: 0;
}
body div.layout div.container-main div.left-list {
  display: inline-block;
  text-align: left;
}
body div.layout div.container-main a.btn,
body div.layout div.container-main button.btn {
  padding: 13px;
  padding-left: 30px;
  padding-right: 30px;
  outline: none !important;
  box-shadow: none !important;
  transition: all 0.3s ease-in-out;
  border-radius: var(--calendar-js-border-radius);
  font-weight: 700 !important;
  border: none !important;
  text-decoration: none !important;
  font: 18px/1.6 poppins, Helvetica, sans-serif, serif;
  min-width: 280px;
  margin: 5px !important;
}
@media (min-width: 992px) {
  body div.layout div.container-main a.btn,
  body div.layout div.container-main button.btn {
    font: 20px/1.6 poppins, Helvetica, sans-serif, serif;
  }
}
body div.layout div.container-main a.btn-smaller,
body div.layout div.container-main button.btn-smaller {
  font: 14px/1.6 poppins, Helvetica, sans-serif, serif;
  padding: 8px;
  padding-left: 10px;
  padding-right: 10px;
}
@media (min-width: 992px) {
  body div.layout div.container-main a.btn-smaller,
  body div.layout div.container-main button.btn-smaller {
    font: 16px/1.6 poppins, Helvetica, sans-serif, serif;
  }
}
body div.layout div.container-main a.btn-success,
body div.layout div.container-main a.btn-success:hover,
body div.layout div.container-main a.btn-success:active,
body div.layout div.container-main a.btn-success:focus,
body div.layout div.container-main a.btn-success:visited,
body div.layout div.container-main button.btn-success,
body div.layout div.container-main button.btn-success:hover,
body div.layout div.container-main button.btn-success:active,
body div.layout div.container-main button.btn-success:focus,
body div.layout div.container-main button.btn-success:visited {
  background-color: var(--calendar-js-color-link) !important;
  color: var(--calendar-js-color-light);
}
body div.layout div.container-main a.btn-secondary,
body div.layout div.container-main a.btn-secondary:hover,
body div.layout div.container-main a.btn-secondary:active,
body div.layout div.container-main a.btn-secondary:focus,
body div.layout div.container-main a.btn-secondary:visited,
body div.layout div.container-main button.btn-secondary,
body div.layout div.container-main button.btn-secondary:hover,
body div.layout div.container-main button.btn-secondary:active,
body div.layout div.container-main button.btn-secondary:focus,
body div.layout div.container-main button.btn-secondary:visited {
  background-color: var(--calendar-js-color-dark) !important;
  color: var(--calendar-js-color-light);
}
body div.layout div.container-main a.btn-success:hover,
body div.layout div.container-main a.btn-secondary:hover,
body div.layout div.container-main a.btn-danger:hover,
body div.layout div.container-main button.btn-success:hover,
body div.layout div.container-main button.btn-secondary:hover,
body div.layout div.container-main button.btn-danger:hover {
  opacity: 0.7;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Code Display
    -------------------------------------------------------------------------
*/
body div.layout div.container-main div.code-display {
  position: relative;
  padding: 10px;
  background-color: var(--calendar-js-color-dark);
  color: var(--calendar-js-color-light);
  border-radius: var(--calendar-js-border-radius);
  padding-right: 40px;
}
body div.layout div.container-main div.code-display span.copy {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 20px;
  color: var(--calendar-js-color-light);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
body div.layout div.container-main div.code-display span.copy:hover {
  opacity: 0.7;
}
body div.layout div.container-main div.code-display pre {
  margin-bottom: 0;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Footer
    -------------------------------------------------------------------------
*/
body div.layout footer div.footer-background {
  padding-bottom: 50px;
  padding-top: 50px;
  padding-left: 25px;
  padding-right: 25px;
  background: linear-gradient(to right, var(--calendar-js-color-darker-grey), var(--calendar-js-color-grey));
  border-top-left-radius: 50% 105px;
  border-top-right-radius: 50% 105px;
  margin-top: 40px;
}
body div.layout footer div.footer-contents {
  background-color: var(--calendar-js-color-dark);
  color: var(--calendar-js-color-light);
  padding: 15px;
}
@media (min-width: 992px) {
  body div.layout footer div.footer-contents {
    padding: 25px;
  }
}
body div.layout footer div.footer-contents a {
  color: var(--calendar-js-color-hover);
  text-decoration: none;
}
body div.layout footer div.footer-contents a:hover {
  text-decoration: underline;
}
body div.layout footer div.footer-contents div.row {
  margin-left: auto;
  margin-right: auto;
  max-width: 1260px;
  text-wrap: nowrap;
}
body div.layout footer div.footer-contents div.row a.social-media {
  text-decoration: none;
}
body div.layout footer div.footer-contents div.row a.social-media img {
  height: 35px;
  transition: all 0.3s ease-in-out;
  margin-left: 4px;
  margin-right: 4px;
  border-radius: 50%;
}
body div.layout footer div.footer-contents div.row a.social-media:hover img {
  opacity: 0.7;
  text-decoration: none;
}

/*
    -------------------------------------------------------------------------
    Calendar.js Website - Annimations
    -------------------------------------------------------------------------
*/
@keyframes fade-in-effect {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22file:///C:/Users/willi/source/repos/Calendar-Js-Website/Calendar.Js.Website/wwwroot/css/site.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAMA;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;;AAKJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;;AAMZ;AAAA;AAAA;AAAA;AAAA;AAQQ;EACI;EACA;;AAGI;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EATJ;IAUQ;IACA;IACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EAEI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AASxB;AAAA;AAAA;AAAA;AAAA;AAQQ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAhBJ;IAiBQ;;;AAGJ;EACI;;AAGJ;AAAA;EAEI;EACA;EACA;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AASY;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAIR;AAAA;EAEI;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAIA;EACI;EACA;;AAEA;EACI;;AAMR;EACI;EACA;EACA;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;;AAGJ;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAhBJ;AAAA;IAiBQ;;;AAIR;AAAA;EAEI;EACA;EACA;EACA;;AAEA;EAPJ;AAAA;IAQQ;;;AAIR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUI;EACA;;AAGJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAUI;EACA;;AAGJ;AAAA;AAAA;AAAA;AAAA;AAAA;EAMI;;;AAOhB;AAAA;AAAA;AAAA;AAAA;AASY;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;;;AAQpB;AAAA;AAAA;AAAA;AAAA;AASY;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EALJ;IAMQ;;;AAGJ;EACI;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;;AAU5B;AAAA;AAAA;AAAA;AAAA;AAMA;EACI;IACI;;EAGJ;IACI%22%7D */