/* Smartphones - denne style bruges udelukkende til at se om vi er p� en lille sk�rm. Det bestemmer s� om vi skal vise den lille eller store apointmentbox */
@media only screen and (max-width: 760px) {
    #some-element { display: none; }
}
.text {
	font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size: 10pt;
	font-weight: normal;
	color: #fff;
}

    table tbody th, table tbody td {
        padding: 1px 0px 1px 7px;
        font-size: 11pt;

    }

    table {
        border-collapse: collapse;
    }
    th, td {
        border-bottom: 1px solid var(--theme-border-color);
        padding: 0px;
    }
    th {
        background-color: #777;
        color: white;
    }

  #footer {
    position : absolute;
    bottom : 0;
    height : 40px;
    margin-top : 40px;
  }
  .modallayout {
      border-radius: 10px;
      background-color: #DCE3FF;
  }

.supPagesStyle {
    background-color: #EEF3FB;
    border-bottom: 0px #000 solid;
    padding:5px;
    margin-top:0px;
}

.generalBackGroundColor {
    background-color: #EEF3FB;
}

.responsive-spacer {
  height: 30px; /* små skærme (mobil) */
}

@media (min-width: 768px) {
  .responsive-spacer {
    height: 50px; /* mellem skærme (tablet) */
  }
}

@media (min-width: 1200px) {
  .responsive-spacer {
    height: 80px; /* store skærme (desktop) */
  }
}


/* ----------------EMOJIIS---------------- */
.flagicons {
    width:30px;
    margin:0px;
    margin-left:1px;
}
/* Aftale font i emojipickeren*/
.emojiPicker {
    float:left;
    font-size:25px;
    width:38px;
    height:38px;
    margin:0px;
    font-family: 'Segoe UI Emoji', 'Twemoji Mozilla', 'Noto Color Emoji', 'Apple Color Emoji', sans-serif;
}

.apointmentBoxNoteEdit {
    background-color:#F6F6B9;
    border: 1px #000 solid;
    width:100%;
    height:180px;
    color: black;
    font-size: 12pt;
    padding:5px;
}

.apointmentBoxNoteReadOnly {
    display:none;
    background-color:#F6F6B9;
    padding:10px;
    height:250px;
    overflow:auto;
    border-top:1px #888 solid;
    font-size: 12pt;
}
/* Aftale font bruges mange steder */
.ieemojifont {
    /*font-family: -apple-system, sans-serif, 'Segoe UI', 'Apple Color Emoji', 'Segoe UI Emoji', 'Twemoji Mozilla', 'Noto Color Emoji', 'Apple Color Emoji', 'lucida grande', tahoma, verdana, arial, sans-serif;*/
    font-family: sans-serif, 'Segoe UI', 'Apple Color Emoji', 'Segoe UI Emoji', 'Twemoji Mozilla', 'Noto Color Emoji', 'Apple Color Emoji', 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-feature-settings: "kern" 1, "liga" 1;
    letter-spacing: normal;
    word-spacing: 0;
    line-height: 1.6;
}

/* ---------------- CALENDAR STYLES (Resten er i stylesheets for themes)---------------- */

/* DEP */
/* Aftale font i aftaleboksen */
.apointmentBoxNew2 {
    word-wrap: break-word;
    overflow-x: hidden; /* Hide horizontal scrollbar */
    overflow-y: scroll; /* Add vertical scrollbar */
    background-color:#fff;
    border: 1px #000 solid;
    width:100%;
    height:180px;
    color: black;
    font-size: 12pt;
    font-family: 'Segoe UI Emoji', 'Twemoji Mozilla', 'Noto Color Emoji', 'Apple Color Emoji', sans-serif;
    padding:5px;
}
.borderChange{
    /*padding: 3px;*/
    border-color: var(--theme-border-color);
    border-width: 1px 0px 0px 1px;
    border-style: solid;
}


#calendarTable1 td {
    border: 1px var(--theme-border-color) solid;
    border-top:0px var(--theme-border-color) solid;
    border-right:0px var(--theme-border-color) solid;
    padding: 5px;
}
#calendarTable1 td.highlighted {
    /*background-color:#999;*/
    border: 3px #000 solid;
    padding: 0px 1px 0px 1px;
}


.intro {
    font-size: 150%;
    color: red;
}


/* Bruges til at tilpasse foundation tabeller*/
.calendarTable table {
    position: relative;
    border-collapse:collapse;
    border: 1px;
}

.calendarTable td {
    padding: 13px;
    border-color: var(--theme-border-color);
    border-width: 1px 1px 1px 1px;
    border-style: solid;
}
.calendarTable th {
    padding: 3px;
    border-color: var(--theme-border-color);
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    font-size: 10pt;
    font-weight: normal;
}

table.datetable tbody tr {
    background-color: #DDE4FB;
    border: 0px #9f83bc solid;
}

table.datetable tbody td {
    background-color: #DDE4FB;
    border: 0px #9f83bc solid;
}

table.sharetable tbody tr {
    background-color: #fff;
    border: 0px #9f83bc solid;
}

table.sharetable tbody td {
    background-color: #fff;
    border: 0px #9f83bc solid;
}
/* N�r man klikker p� en celle skal udseende �ndre sig, og �ndre sig tilbage bagefter (function dateCellClicked i fe_calendar )*/
/* Bruges m�ske ikke mere?*/

.appointmentDayActiveBackToNormal {
    border: 0px #333 solid;
    border-width: 1px 0px 0px 1px;
    padding:3px;
    background-color: #fff;
}

/*-------------------------------- Form elements --------------------------------*/

/*Bruges m�ske ikke mere*/
label.float { float: left; display: block; width: 100px; margin: 4px 0 0 0; clear: left; }
label { display: block; width: auto; margin: 0 0 10px 0; }

.xInput {border: 1px solid #909090; padding: 3px; margin: 0 0 8px 0;}

/* Skulle undg� linieskift efter forms i IE*/
form {
    margin: 0px;
    padding: 0px;
}

/*Bruges fordi IE ikke kan vise placeholder tekst*/
.onlyIE_visible{
    display:none;
}
/*-------------------------------- MENUER --------------------------------*/

.topbuttontext{
    position: absolute;
    top: 29px;
    left: 19px;
    font-weight:bold;
    font-size: 10px;
    color:#777;
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    width: 100%;
}
.topbuttontext_2_letters{
    left:22px;
}

.topbuttontext_3_letters{

}

.topbuttontext_4_letters{
    left:14px;
}

.topbuttontext_5_letters{
    left:12px;
}
.badgeposition {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 1.9em;
    min-width: 1.9em;
    height: 1.9em;
    padding: 0;
    box-sizing: border-box;
    line-height: 1.9em;
    text-align: center;
    background-color: var(--theme-btn-hover-bg, darkblue);
    color: var(--theme-btn-color, #fff);
    border: 1px solid rgba(0,0,0,0.4);
    font-weight: bold;
}
.topbutton {
    border:1px #777 solid;
    border-radius:11px;
    width:46px;
    height:46px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
}

.topbuttonActive {
    background-color: #abd;
}

.topbuttonInActive {
    background-color: #fff;
}

.topbutton:hover {
    background-color: #abd;
}

.topbuttontextnew {
    font-weight:bold;
    font-size: 10px;
    color:#777;
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    margin-top:-3px;
}

/* Bruges i burgermenu*/
.lineover {
    height:1px;
    color:#DDD;
    background-color: #fff;
    margin:5px;
}

/*-------------------------------- NYT OVERSIGTEN --------------------------------*/

.oneHistory{
    background-color: #fff;
}

.oneHistory:hover{
    background-color: #eceff6;
}

.oneHistory_new{
    background-color:  #f4f6f9;
}

/*-------------------------------- FRIEND LIST OVERLAY--------------------------------*/
.friendlist_heading {
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size:11px;
    color:#333333;
    border-bottom-color:#DDDDDD;
    border-bottom-width:1px;
    border-bottom-style:solid;
}
.friendlist_text {
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size:11px;
    color:#333333;
    line-height: 14px;
}

.friendlist_text_gray {
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size:11px;
    color:#999999;
    line-height: 16px;
}

.friendlist_dropdown {
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size:11px;
    color:#333333;
    width:150px;
    height:30px;
}

.friendlist_button {
    font-weight:normal;
    color:#333333;
    border:1px #333 solid;
    height:23px;
    width:100px;
    cursor:pointer;
}
.friendlist_link {
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    font-size:11px;
    color:#3B5998;
    cursor:pointer;
    text-decoration:none;
}

.friendlist_link:hover {
    text-decoration:underline;
}

/*-------------------------------- FB STYLES --------------------------------*/

.fbbluebox {
    background-color: #eceff6;
    border: 1px solid #d4dae8;
    color: #333333;
    padding: 10px;
    font-size: 11px;
    font-weight: bold;
}

.fberrorbox {
    background-color: #ffebe8;
    border: 1px solid #dd3c10;
    color: #333333;
    padding: 10px;
    font-size: 11px;
    font-weight: bold;
    font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
}

.fbmenu_heading{
    font-size:16px;
    line-height:30px;
    text-decoration:none;
    padding-left:16px;
    padding-right:22px;
    border:1px solid #fff;

    display: block;
    font-weight: 600;
}
.fbmenu_NEW {
    padding: 0px 0px 3px 15px;
    letter-spacing: normal;
    color: rgb(29, 33, 41);
    font-size: 13px;
    font-weight: 600;
    font-family: Arial, sans-serif;
    line-height: 16px;
    min-height: 26px;
}
.fbmenu_old{
    font-family: Arial, sans-serif;
    text-decoration:none;
    padding-left:12px;
    padding-right:12px;
    border:1px solid #fff;
    line-height:20px;
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: rgb(29, 33, 41);
}
.fbmenu{
    font-family: Arial, sans-serif;
    letter-spacing: 0px;
    text-decoration:none;
    padding-left:12px;
    padding-right:12px;
    border:1px solid #fff;
    font-size: 20px;
    line-height:30px;
    display: block;
    font-weight: 400;
    color: rgb(29, 33, 41);
}

a.fbmenu:hover,a.fbmenu:active {
    background-color: #6d84B4;
    border:1px solid #039;
    display: block;
    line-height:30px;
}

.lineicon {
    width:20px;
    margin-top: -3px;
    margin-right:10px;
}
/*-------------------------------- HJ�LPE OVERLAYS --------------------------------*/

.tutorialOverlaysOuter {
    position: absolute;
    left: 50%;
    z-index:10000000;

}
.tutorialOverlays {
    position: relative;
    left: -50%;

    margin-top:5px;
    background-color: #f0f5ff;
    border:1px #000000 solid;
    box-shadow: 5px 5px 5px #888888;
    padding:10px;
    z-index:10000000;
}
.overlayBoxInner {
    padding:0px;
    border: 1px #999 solid;
    overflow-x:hidden;
    overflow-y:hidden;
    /*box-shadow: #333 0px 3px 8px 0px;*/
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.53);
    -moz-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.53);
    box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.53);
}

.overlayBoxInnerFullHight{
    height: calc(100vh - 60px);
}

/*-------------------------------- APPOINTMENT POPUP --------------------------------*/
/* These are the style specifications for the menu layers.
   Set width to get more browsers' corporation  */
div.menu   {
  position:absolute;
  visibility:hidden; /*hidden visible*/
  width:300px; left:0; top:0; z-index:500;
  font-size:12px;
  background-color:#fff;
  border: 1px solid;
  border-color: #000 #000 #000 #000;
  box-shadow: #333 0px 3px 8px 0px;

}

/* --------------- DATOV�LGER -------------------------*/
#triangle-up   { width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-bottom: 20px solid #a3daff; }
#triangle-down { width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #a3daff; }
.mytabs{
    text-align:center;
    width:33%;
    border:0px #000 solid;
    border-radius: 5px 5px 0px 0px;
    background: #f3f3f3;
}

.tabs-title {
    border-bottom-color: #DDE4FB;
  }
  .tabs-title > a {
      display: block;
      border:1px #000 solid;
      border-radius: 5px 5px 0px 0px;
      padding:5px;
      background: #fff;
    }
    .tabs-title > a:hover {
      border-radius: 5px 5px 0px 0px;
      background: #ddd;
      color: #1468a0; }
    .tabs-title > a:focus, .tabs-title > a[aria-selected='true'] {
      border-width:1px 1px 1px 1px;
      border-bottom-color: #DDE4FB;
      background: #DDE4FB;
      color: #1779ba; }

/* ---------------- FOUNDATION RETTELSES STYLES ----------------------*/
.button {
    border-radius: 8px;
}

/*G�re placeholder tekst m�rkere end standard*/
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #A7A7A7; }

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #A7A7A7; }

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #A7A7A7; }

input::placeholder,
textarea::placeholder {
  color: #A7A7A7; }

.profilecard{
float:left;
border:0px;
text-align: center;
}

.img-circular{
 width: 100px;
 height: 100px;
 background-color: #18F;
 background-size: cover;
 display: block;
 border-radius: 100px;
 padding:5px;
 border:2px #777 solid;

 -webkit-border-radius: 100px;
 -moz-border-radius: 100px;
}
/* Profile button */
.profilebutton {
    color: #333;
    text-decoration: none;
    border: 1px solid #ffffffb3;
    border-radius: 30px;
    height: 47px;
    padding: 2px 8px 2px 12px;
    display: inline-block;
    cursor: pointer;
    background-color: var(--theme-btn-bg);
}

.profilebutton:hover {
    background-color: var(--theme-btn-hover-bg);
}

.profilebutton-theme-fixed {
    background-color: #c3d8f7 !important;
}
.profilebutton-theme-fixed:hover {
    background-color: #8faeed !important;
}

.profileButtonText {
    vertical-align: middle;
    display: inline-block;
    word-wrap: break-word;

    line-height: 1.2;
    text-align: right;
    margin-right: 5px;
    margin-left: 5px;
}

.profileButtonName {
    font-weight: bold;
    font-size: 13px;
    color: #222;
}

.profileButtonRole {
    font-size: 11px;
    color: #555;
}

#profiletriangle-down {
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #fff;
}

.avatarListImages {
    border:2px #777 solid;
    border-radius: 50%;
    width:55px;
    cursor:pointer;
    float:left;
    margin:3px;
}

.avatarWrapper {
  position: relative;
  width: 38px;
  height: 38px;
  overflow: hidden;
  border-radius: 50%;
  border:1px #555 solid;
  cursor:pointer;
}

.avatarImage {
  width: 100%;
  height: auto;
}

/* Mennesker */
.avatarImage2 {
  width: 100%;
  margin-top: 11%;
}

/* B�rn */
.avatarImage3 {
  margin-top: 15%;
}

/* Dyr */
.avatarImage4 {
  width: 70%;
  margin-top: 20%;
}

/* Huse */
.avatarImage5 {
  width: 70%;
  margin-top: 15%;
}

/* Ting */
.avatarImage6 {
  width: 70%;
  margin-top: 16%;
}

/* Monstre */
.avatarImage7 {
  width: 80%;
  margin-top: 11%;
}

/* Mennesker 2 */
.avatarImage8 {
  width: 94%;
  margin-top: 11%;
}

/* Mennesker 3 */
.avatarImage9 {
  width: 94%;
  margin-top: 11%;
}

.avatarImageWild {
  width: 100%;
  height: auto;
  border:4px #18F dotted;
}

.productBox {
    background-color: lightblue;border:1px #A9BCF5 solid;border-radius:10px;
    cursor:pointer;
}
.productBoxActive {
    background-color: #489FB5;border:1px #A9BCF5 solid;border-radius:10px;
    cursor:pointer;
}

.productBox:hover{
    background-color: #a6cdd8;
}

/* ---------------- writeDays() CALENDAR LAYOUT STYLES ---------------- */

.hidden-input {
    width: 1000px;
}

#p1 {
    background-color: #fff;
}

.subscription-status-alert {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 200;
    margin: 0;
}

.top-nav-rounded {
    position: fixed;
    top: 20px;
    left: 1.4%;
    right: 1.4%;
    max-width: initial !important;
    overflow: hidden;
    border-radius: 18px; /* Fjern denne hvis mobil ikke skal have runde hjørner */
    z-index: 100;
}

.top-nav-rounded.compact-view {
    top: 10px;
}

@media (min-width: 761px) {
    .top-nav-rounded {
        border-radius: 18px;
    }
}

.calendar-top-bar {
    background-color: #fff;
    border-top: 0px #000 solid;
    padding-top: 0px;
    margin: 0px;
    position: fixed;
    top: 110px;
    left: 0;
    right: 0;
}

.calendar-top-bar.compact-view {
    top: 80px;
}

.calendar-top-bar-inner {
    border: 0px;
    text-align: center;
    padding: 0px;
}

.calendar-side-spacer {
    width: 1%;
    height: 100px;
    float: left;
}

.calendar-shadow-wrapper {
    float: left;
    width: calc(98% - 10px);
    margin: 5px;
    box-shadow: 0 12px 30px rgba(39, 61, 105, 0.10);
    clip-path: inset(0px -30px -30px -30px);
    border-radius: 18px; /* Fjern denne hvis mobil ikke skal have runde hjørner */
}


.calendar-scroll-container {
    position: relative;
    background-color: #fff;
    width: 100%;
    border-top: 1px var(--theme-border-color) solid;
    border-right: 1px var(--theme-border-color) solid;
    border-bottom: 1px var(--theme-border-color) solid;
    padding: 0px;
    margin: 0px;
    float: left;
    overflow-x: auto;
    overflow-y: auto;
    height: calc(100vh - 110px);

    border-radius: 18px; /* Fjern denne hvis mobil ikke skal have runde hjørner */
}


@media (min-width: 761px) {
    .calendar-shadow-wrapper {
        border-radius: 18px;
    }
    .calendar-scroll-container {
        border-radius: 25px;
    }
}




.calendar-table-main {
    position: relative;
    table-layout: fixed;
    width: 100%;
    border: 0px #000 solid;
    border-collapse: separate;
    border-spacing: 0;
}

.calendar-header-row {
    z-index: 10000;
}

th.monthheading {
    cursor: pointer;
    background-color: #A9BCF5;
    border-right: 0px var(--theme-border-color) solid;
    border-top: 0px var(--theme-border-color) solid;
    border-bottom: 1px var(--theme-border-color) solid;
    border-left: 1px var(--theme-border-color) solid;
    text-align: center;
    z-index: 2000000;
}

.moredays-arrow-up {
    width: 24px;
    height: 20px;
}

th.namesheading {
    overflow: hidden;
    text-align: center;
    z-index: 10000;
    border-right: 0px #777 solid;
    border-top: 0px #777 solid;
    font-weight: 700;
    font-size: 0.9rem;
    padding: 10px 5px;
}



tr.weekdaystyle {
    border: 0px #777 solid;
}

td.weekdaystyle {
    white-space: nowrap;
    text-align: left;
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 0px;
    border-top: 0px #777 solid;
    border-right: 0px #777 solid;
}

div.monthheading {
    border-width: 1px;
    text-align: center;
    padding-left: 0px;
    font-weight: bold;
    padding-top: 0px;
    border-bottom: 1px var(--theme-border-color) solid;
}

.day-container {
    padding-top: 3px;
}

.week-number {
    font-size: 10px;
    width: 100%;
    padding-left: 3px;
}


.week-number-label {
    display: inline-flex;
    padding: 3px 8px;
    font-size: 0.62rem;
    border-radius: 999px;
    background: rgba(111,143,220,0.12);
    color: var(--brand-dark);

    font-weight: 700;
    margin-bottom: 6px;
}



.day-number {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    padding-left: 5px;
}



.day-name {
    margin-top: 2px;
    color: #6b7a96;;
    font-size: 0.8rem;
    font-weight: 600;
    padding-left: 5px;
}

#calendarTable1.compact-view td {
    padding: 2px;
}

#calendarTable1.compact-view th.namesheading {
    padding: 3px;
}

#calendarTable1.compact-view .day-container {
    white-space: nowrap;
}

#calendarTable1.compact-view .week-number-label {
    display: block;
    width: fit-content;
    padding-bottom: 0;
    background-color: transparent;
    border-radius: 0;
}

#calendarTable1.compact-view .day-number,
#calendarTable1.compact-view .day-name {
    display: inline;
    font-size: 11pt;
    line-height: 1.3;
    margin-top: 0;
}

#calendarTable1.compact-view .appointment-cell {
    padding: 0 !important;
    overflow: hidden;
}

#calendarTable1.compact-view .appointment-card {
    border-radius: 0;
    padding: 3px;
    border: none;
    min-height: 0;
    padding-bottom: 9999px;
    margin-bottom: -9999px;
}

@media (max-width: 760px) {
    .top-nav-rounded {
        top: 10px;
    }

    .calendar-top-bar {
        top: 80px;
    }

    .calendar-scroll-container {
        height: calc(100vh - 80px);
    }

    .top-nav-rounded.compact-view-mobile-only {
        top: 10px;
    }

    .calendar-top-bar.compact-view-mobile-only {
        top: 80px;
    }

    #calendarTable1.compact-view-mobile-only td {
        padding: 2px;
    }

    #calendarTable1.compact-view-mobile-only th.namesheading {
        padding: 3px;
    }

    #calendarTable1.compact-view-mobile-only .day-container {
        white-space: nowrap;
    }

    #calendarTable1.compact-view-mobile-only .week-number-label {
        display: block;
        width: fit-content;
        padding-bottom: 0;
        background-color: transparent;
        border-radius: 0;
    }

    #calendarTable1.compact-view-mobile-only .day-number,
    #calendarTable1.compact-view-mobile-only .day-name {
        display: inline;
        font-size: 11pt;
        line-height: 1.3;
        margin-top: 0;
    }

    #calendarTable1.compact-view-mobile-only .appointment-cell {
        padding: 0 !important;
        overflow: hidden;
    }

    #calendarTable1.compact-view-mobile-only .appointment-card {
        border-radius: 0;
        padding: 3px;
        border: none;
        min-height: 0;
        padding-bottom: 9999px;
        margin-bottom: -9999px;
    }
}

.holiday-label {
    width: 100%;
    height: 12px;
    line-height: 12px;
    font-size: 10px;
    float: left;
    overflow: hidden;
    text-align: center;
}

.appointment-cell {
    min-width: 100px;
    word-wrap: break-word;
    text-align: left;
    vertical-align: top;
    padding: 6px !important;
}


.appointment-card {
    border-radius: 14px;
    padding: 7px 10px;
    border: 1px solid var(--theme-border-color);
    background: #fff;
    line-height: 1.28;
    box-shadow: 0 2px 6px rgba(31,42,68,0.05);
    min-height: calc(1.28em + 14px);
}

#calendarTable1.bubble-view-darker:not(.compact-view):not(.compact-view-mobile-only) .appointment-card:not(.has-custom-bgcolor) {
    box-shadow: 0 2px 6px rgba(31,42,68,0.05), inset 0 0 0 9999px rgba(0,0,0,0.025);
}

@media (min-width: 761px) {
    #calendarTable1.bubble-view-darker.compact-view-mobile-only .appointment-card:not(.has-custom-bgcolor) {
        box-shadow: 0 2px 6px rgba(31,42,68,0.05), inset 0 0 0 9999px rgba(0,0,0,0.025);
    }
}

#calendarTable1.bubble-view-flat .appointment-cell {
    padding: 0 !important;
}

#calendarTable1.bubble-view-flat .appointment-card {
    border: none;
    border-radius: 0;
    box-shadow: none;
}


#moreDaysLoader-container {
    display:none;
}

/* https://www.svgbackgrounds.com/elements/animated-svg-preloaders/ */
#moreDaysLoader {
    color: #14679E;
    width:80px;
    height: 80px;
    text-align: center;
}


.loader_icon {
    width: 80px;
    height: 80px;
}


.calendar-footer-bar {
    width: 100%;
    background-color: #E9EFF8;
    text-align: center;
    padding: 14px 0 18px;
}

.load-more-btn {
    height: 50px;
    width: 350px;
}

.load-more-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 28px;
    color: var(--theme-btn-color);
    font-weight: 700;
    font-size: 0.9rem;
    font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
    text-decoration: none;
    background-color: var(--theme-btn-bg);
    border-radius: 999px;
    border: 1px var(--theme-border-color) solid;
    box-shadow: 0 2px 6px rgba(31, 42, 68, 0.07);
    cursor: pointer;
}

.load-more-link:hover {
    background-color: var(--theme-btn-hover-bg);
    color: var(--theme-btn-color);
}

.load-more-link img {
    width: 18px;
    height: auto;
}

.cal-hidden {
    display: none;
}

body.iframe-mode .calendar-top-bar {
    top: 0;
}

body.iframe-mode .calendar-scroll-container {
    height: 100vh;
}

.subscription-expired {
    margin: auto;
    margin-top: 30px;
    margin-bottom: 200px;
    width: 50%;
    vertical-align: middle;
    border-radius: 10px;
    border: 3px #0089ec solid;
    text-align: center;
    padding: 50px;
    background-color: #000;
    color: #0089ec;
}

.subscription-expired img {
    width: 85px;
    vertical-align: middle;
}

/* ----------------APPOINTMENTBOX ICON BUTTONS---------------- */
#repeatButton {
    width: 30px;
    height: 30px;
    margin: 2px 0px 0px 2px;
    cursor: pointer;
    float: left;
}
#repeatButtonInactive {
    width: 30px;
    height: 30px;
    margin: 2px 0px 0px 2px;
    float: left;
}
#markManyButton {
    width: 32px;
    height: 32px;
    margin: 2px 0px 0px 2px;
    cursor: pointer;
    float: left;
}
#itemnote_image {
    width: 31px;
    height: 31px;
    margin: 4px 0px 0px 0px;
    cursor: pointer;
    display: inline;
}
#dayhistoryButton {
    border: 0px solid #ccc;
    width: 25px;
    height: 25px;
    margin: 4px 0px 0px 2px;
    cursor: pointer;
}
#closeButton {
    width: 30px;
    height: 30px;
    margin: 2px 0px 0px 2px;
    cursor: pointer;
}
#closeButtonNote {
    width: 30px;
    height: 30px;
    cursor: pointer;
}
#template0NoteButton {
    width: 40px;
    height: 40px;
    margin: 1px 5px 0px 0px;
    cursor: pointer;
    background-color: #FFFFCC;
}

/* Bottom line*/

#paletteButton {
    width: 40px;
    height: 40px;
    margin: 1px 0px 0px 0px;
    cursor: pointer;
}
#iconsButton {
    width: 40px;
    height: 40px;
    margin: 1px 5px 0px 0px;
    cursor: pointer;
}