@font-face {
  font-family: 'Roboto';
  src: url('fonts/Roboto/Roboto-VariableFont_wdth,wght.woff2') format('woff2'),
       url('fonts/Roboto/Roboto-VariableFont_wdth,wght.woff') format('woff'),
       url('fonts/Roboto/Roboto-VariableFont_wdth,wght.ttf') format('truetype');
  font-weight: 100 900; /* Variable range */
  font-style: normal;
}

@font-face {
  font-family: 'Roboto';
  src: url('fonts/Roboto/Roboto-Italic-VariableFont_wdth,wght.woff2') format('woff2'),
       url('fonts/Roboto/Roboto-Italic-VariableFont_wdth,wght.woff') format('woff'),
       url('fonts/Roboto/Roboto-Italic-VariableFont_wdth,wght.ttf') format('truetype');
  font-weight: 100 900; /* Variable range */
  font-style: italic;
}

:root {
    /*
  --purple-color: #850092;
  --pinky-purple: #B84CBC;
  */
  --color-purpleish: #B06DAA;
  --color-darkish-purple: #742684;
  --color-deep-lavender: #5D388E;
  --color-heather: #BA9BC9;
  --dark-gray: #444444;
}

a.button {
    color: white!important;
}

#k-main-wrapper {
  background-color: #FFFFFF;
  padding-bottom: 40px;
}

#k-header-top {
    background-color: #FFFFFF;
}

#k-top {
    display: flex;
    justify-content:space-between;
    align-items: flex-end;
    padding-top: 20px;
    padding-bottom: 20px;
}

#k-top .button {
    margin-top: 10px;
    margin-bottom: 0px;
}

#k-header {
  background-color: var(--color-deep-lavender);
  color: #FFFFFF;
  position: sticky;
  top: 0px;
  z-index: 2;
}

#k-main-logo {
    width: 400px;
    padding-right: 20px;
}

#k-pano {
  background-color: var(--color-heather);
  color: #FFFFFF;
  font-size: 130%;
  padding-top: 20px;
  padding-bottom: 10px;
}

#k-pano .button {
    background-color: var(--color-darkish-purple) !important;
}
#k-pano .button:hover {
    background-color: var(--color-deep-lavender)!important;
}

#k-pano-content {
    position: relative;
}

#k-pano-content-circles {
    position: absolute; 
    z-index: 1;
    bottom: -80px; 
    right: 80px;
}
#k-pano-content-circles img {
    width: 500px;
}

.k-big-text {
  font-size: 160%;
}

#k-main {
  background-color: #FFFFFF;
  min-height: 500px;
  margin-top: 40px;
}

#k-menu-mobile {
  position: relative;
  text-align: right;
  padding: 15px;
}

#k-menu-mobile > ul > li > a,
#k-menu-mobile > ul > li > span.menu-no-link
 {
 text-transform: uppercase;
}

#k-menu-mobile > ul {
 position: absolute;
 right: 0px;
 background-color: #ffffff;
 padding: 20px;
 border: 1px solid #333333;
 text-align: left;
 background-color: var(--color-heather);
}

#k-menu-mobile a {
  text-decoration: none;
  padding-top: 2px;
  padding-bottom: 2px;
  color: #EEEEEE;
}

#k-menu-mobile a:hover {
  color: #FFFFFF;
}

#k-menu-mobile ul {
 list-style: none;
}

#k-menu-mobile li {
  padding-top: 6px;
  padding-bottom: 6px;
}



#k-menu-mobile .fa-bars,
#k-menu-mobile .fa-times
{
  font-size: 150%;
}

/*
#k-menu {

}
*/

#k-menu ul {
  padding: 0px;
  margin: 0px;
}

/* depth 1 */
#k-menu > ul > li {
  margin-right: 20px;
  padding-top: 15px; /* a */
  padding-bottom: 15px;
  border-bottom: 2px solid transparent; /* b */

}

#k-menu > ul > li:hover {
  border-bottom: 2px solid #FFFFFF;
   
}

#k-menu > ul > li a {
 color: #EEEEEE;
}

#k-menu > ul > li > a,
#k-menu > ul > li > span.menu-no-link
 {
 text-transform: uppercase;
}

#k-menu > ul > li a:hover {
 color: #FFFFFF;
  
}

/* depth 2 */

#k-menu > ul > li > ul {
  margin-left: 0px;
  margin-top: 17px; /* a + b */
  padding-left: 20px!important;
  padding-right: 60px!important;
  padding-top: 10px!important;
  padding-bottom: 10px!important;
  border: 1px solid #333333;
  background-color: var(--color-heather);
}

#k-menu > ul > li > ul > li {
 padding-top: 5px;
 padding-bottom: 5px;
 padding-left: 10px;
 padding-right: 10px;
 border-top: 1px solid var(--dark-gray);
}

#k-menu > ul > li > ul > li > a {
 color: #FFFFFF;
}

#k-menu > ul > li > ul > li:last-child {
  border-bottom: 1px solid var(--dark-gray);
}

#k-menu > ul > li > ul > li:hover {
  background-color: var(--dark-gray);
}

#k-footer {
  padding-top: 40px;
  padding-bottom: 40px;
}

#k-footer h5 {
  color: #000000;
}

.k-separator {
  margin-top: 40px;
  border-top: 1px solid #eeeeee;
  margin-bottom: 40px;
}

.k-footer-bottom {
  font-size: 90%;
}

#k-footer img.k-vaud {
  float: left;
  margin-top: 5px;
  margin-right: 20px;
  width: 40px;
  height: auto;
}

.dates_box {
   width: auto;
   background-color: var(--color-heather);
   color: white;
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 20px;
   margin-bottom: 5px;
}

.k-label {
   background-color: var(--color-heather);
   color: white;
   padding: 8px;
}

.k-label i {
    margin-right: 5px;
}


