body
{
   background-color: #F0FFFF;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 13px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
}

html{
   zoom: 1.0 !important;
}

:root {
   --scale-X: 1;
   --scale-Y: 1;
   --scale-page-Y: 1;
   --rescale-image-Y: 1;
   --header-height: 90px;
   --mobile-layer-top: 90px;
   --statusbar-height: 0;
   --swiper-pagination-top: 606px;
   --swiper-wrapper-height: 672px;
   --av-scale-X: 1;
   --av-scale-Y: 1;
}

.adultCB {
  visibility: hidden;
}

.puptentCB {
  visibility: hidden;
}

.attendCB {
  left: 1px !important;
  top: 1px !important;
  visibility: hidden;
}

#SiteMap {
   z-index=999;
}

.swiper-pagination {
   height: 50px;
}

#Book, #Units1 {
   cursor: pointer;
   opacity: 1;
}

#Book [disabled] {
   cursor: not-allowed;
   opacity: 0.5;
}

#Units1:disabled, #Units2:disabled {
   opacity:0;
}

.footer-label {
   background: transparent !important;
   color: #0000CD;
}

@import url(//db.onlinewebfonts.com/c/7cc6719bd5f0310be3150ba33418e72e?family=Comic+Sans+MS);

@font-face {font-family: "Comic Sans MS";
   src: url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot"); 
   src: url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.eot?#iefix") 
   format("embedded-opentype"), url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff2") 
   format("woff2"), url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.woff") format("woff"), 
   url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.ttf") format("truetype"), 
   url("//db.onlinewebfonts.com/t/7cc6719bd5f0310be3150ba33418e72e.svg#Comic Sans MS") format("svg"); 
} 

/* pan-y is a workaround for swiper not working on textboxes */
#pitchnote, #wb_Text4, #wb_Text99, #bookedmembers, #LogText {
   touch-action: pan-y;
}

@font-face {
  font-family: 'Comic Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Comic Sans'), local('Comic-Sans'), url(https://fonts.gstatic.com/s/architectsdaughter/v8/KtkxAKiDZI_td1Lkx62xHZHDtgO_Y-bvTYlg4w.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Happy Monkey';
  font-style: normal;
  font-weight: 400;
  src: local('Happy Monkey'), local('HappyMonkey-Regular'), url(https://fonts.gstatic.com/s/happymonkey/v6/K2F2fZZcl-9SXwl5F_C4R_OwAAr3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Indie Flower';
  font-style: normal;
  font-weight: 400;
  src: local('Indie Flower'), local('IndieFlower'), url(https://fonts.gstatic.com/s/indieflower/v9/m8JVjfNVeKWVnh3QMuKkFcZVaUuH.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Josefin Slab';
  font-style: normal;
  font-weight: 400;
  src: local('Josefin Slab Regular'), local('JosefinSlab-Regular'), url(https://fonts.gstatic.com/s/josefinslab/v8/lW-5wjwOK3Ps5GSJlNNkMalnqg6v.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400;
  src: local('Dancing Script Regular'), local('DancingScript-Regular'), url(https://fonts.gstatic.com/s/dancingscript/v9/If2RXTr6YS-zF4S-kcSWSVi_szLgiuE.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.nonMobile {
   width:414px;
   position:relative;
   margin-left:auto;
   margin-right:auto;
   text-align:left;
   opacity:0
}

.mobile {
   width:414px;
   position:relative;
   top:0;
   left:0;
   margin:0 auto;
   text-align:left;
   opacity:1;
}

.scaleAvatar{
   transform: scale( var(--av-scale-X), var(--av-scale-Y) );
   transform-origin: 0 0;
   overflow: hidden;
}

.scalePage{
   transform: scale( var(--scale-X), var(--scale-Y) );
   transform-origin: 0 0;
   overflow: hidden;
}

.rallyButton:active {
  transform: translateX(3px);
  transform: translateY(3px);
}

#welcome {
   margin: var(--mobile-layer-top) 0px 0px 0px !important;
}

#wb_sitepic{
   visibility: hidden;
   width: 1px;
   height: 1px;
   top: 1px;
   left: 1px;
}

.sitepic_active{
   visibility: visible !important;
   width: 413px !important;
   height: 60px !important;
   top: 1px !important;
   left: 1px !important;
}

.tallScreen {
   top: var(--statusbar-height) !important;
   height: var(--header-height) !important;
}

.mobile_layer{
   top: var(--mobile-layer-top) !important;
   position:absolute !important;
   margin:0 !important;
}

#dayLayer{
   border: 1px #0000ff solid;
   visibility:hidden;
   background-color:#F0E68C;
   border-radius: 5px;
}

#logout:hover{
   border: 2px #878787 solid;
   background-color: #F0F0D8;
   padding: 0px 0px 2px 2px
}

.firstname {
   text-align: center !important;
}

.scalePageHeight{
   transform: scaleY( var(--scale-page-Y) );
   transform-origin: 0 0;
   overflow: auto;
}

.rescaleImage {
   transform: scaleY( var(--rescale-image-Y) );
   transform-origin: 50% 50%;
}

html, body {
   margin:0 auto;
   background-color: lightYellow !important;
   position: fixed;
   height: 100%;
   overflow: hidden;
}

.MyMobForm {
}

.Hide {
   display: block;
}

#notification {
      visibility: hidden;
      z-index: 1;
}
    
#notification.show {
   z-index: 999;
   visibility: visible;
   -webkit-animation: fadein 0.5s;
   animation: fadein 0.5s;
}
    
@-webkit-keyframes fadein {
   from {
      bottom: 0;
      opacity: 0;
   }
   to {
      bottom: 30px;
      opacity: 1;
   }
}

@keyframes fadein {
   from {
      bottom: 0;
      opacity: 0;
   }
   to {
      bottom: 30px;
      opacity: 1;
   }
}
    
.button2 {
   font-family: Tahoma;
   font-weight: bold;
   font-size: 15px;
   text-decoration: none;
   color: #0000FF;
   background-color: #FFFFA0;
   border: 1px solid #B8860B;
   border-radius: 10px;
   box-shadow: 1px 1px 0px #0000FF;
}

.button2:disabled {
   opacity: 0.6 !important;
   color: grey;
}

.menuItem {
   cursor: pointer;
}

.Image
{
   font-weight: normal;
   font-style: normal;
   text-decoration: none;
   background-color: seashell;
   border: 2px #00BFFF solid !important;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border-radius: 10px;
}

.hidden {
   visibility: hidden;
}

.itineraryText{
   border-radius: 10px;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border: 1px #000000 solid;
   background-color: yellow;
   line-height: 1.1875;
}

.tickbox
{
   font-weight: normal;
   font-size: 20px;
   font-style: normal;
   text-decoration: none;
   color: #0000FF;
   background-color: transparent !important;
   border: none !important;
   text-align: center;
}

.welcome_text {
       border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border: 1px #D3D3D3 solid;
}
 
.alert {
      background-color: #FFEBBF !important;
      border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border: 2px #00BFFF solid !important;
}

@media all and (display-mode: standalone) {
    /* Here goes the CSS rules that will only apply if app is running standalone */
    
}

@media all and (max-width: 640px) {

   input[type="checkbox"], input[type="radio"] {
      width: 28px;
      height: 28px;
      -moz-border-radius: 5px ;
      -webkit-border-radius: 5px ;
      border-radius: 5px ;
      margin: 4px 4px 4px 4px;
      border: 2px #00BFFF solid
   }

   input[type="file"] {
      width: 100px;
      height: 80px !important;
      -moz-border-radius: 100% ;
      -webkit-border-radius:100% ;
      border-radius: 100% ;
      border: 2px #00BFFF solid
   }
}

   .button_mobile {
      font-size: 16px;
      color: #FFFFFF;
      background-color: #00efff;
      border: 2px #D3D3D3 outset;
      padding: 4px 4px 10px 4px;
      border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
   }

   .button_mobile:disabled {
      opacity: 0.6 !important;
      color: grey;
   }

.Mobile_InputBox1
{
   font-family: Verdana;
   font-weight: normal;
   font-size: 10px;
   font-style: normal;
   text-align: center;
   color: #0000FF;
   background-color: transparent !important;
   border: none !important;
}

   .Mobile_InputBox2 {
      font-family: Verdana;
      font-weight: normal;
      font-size: 20px;
      font-style: normal;
      text-align: center;
      text-decoration: none;
      color: #0000FF;
      background-color: transparent;
      border: 0px outset ButtonFace;
      padding: 2px 2px 2px 2px;
   }

   .Mobile_InputBox3 {
      font-family: Verdana;
      font-weight: normal;
      font-size: 14px;
      font-style: normal;
      text-align: center;
      text-decoration: none;
      color: #0000FF;
      background-color: transparent;
      border: 0px outset ButtonFace;
      padding: 0px 0px 0px 0px;
      word-wrap: break-word;
   }

   .button {
      -moz-border-radius: 15px;
      -webkit-border-radius: 15px;
      border-radius: 15px;
      cursor: pointer;
      padding: 4px 4px 4px 4px;
   }

        
   img [id*=avatar_] {
      max-width: 120px;
      max-height: 160px;
   }
   
   img[id*=FoodImage] {
      width: 138px;
      height: 80px;
   }

   img[id*=QImage] {
      width: 32px;
      height: 48px;
   }

   img[id*=NightImage] {
      width: 100px;
      height: 78px;
   }


.selected {
   font-weight: bold;
   background-color: #d0fdd0;
   color: black;
}

.unselected {
   font-weight: normal;
   background-color: #dcdcdc;
   color: #2f4f4f;
}

.swiper-wrapper{
   height: var(--swiper-wrapper-height) !important;
}
    
    .swiper {
      width: 100%;
      height: 100%;
    }
    .swiper-slide {
      text-align: center;
      font-size: 18px;
      /* Center slide text vertically */
      display: -webkit-box !important;
      display: -ms-flexbox !important;
      display: -webkit-flex !important;
      display: flex !important;
      -webkit-box-pack: center
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }

    .swiper-pagination-bullet {
      width: 40px !important;
      height: 40px !important;
      background: transparent !important;
      opacity: 1 !important; 
      border-radius:10% !important;
      border:0px !important;
    }
    
    .swiper-pagination-bullet-active {
      color:#fff !important;
      background: #007aff !important;
      border-radius:10% !important;
      border:0px !important;
    }
 
 