@font-face {
  font-family: 'Raleway';
  src: url('Raleway-Regular.ttf') format('truetype');
}

body
{
/*     font-family:  'Open Sans';*/
}
h1, h2
{
    color: #0F75BC !important;
    font-family:Arial;
    font-weight:bold;
}
.headerBackground {
    width: 100%;
    top: 0px;
    left: 0px;
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.7);
    /*background: url("/img/bg/Websiteheader2.png") black;*/
    background-color: black;
    background-attachment: fixed;
}
/*
.headerBackground
{
    
    background-position:center center 100%;
    background-color: black !important;
    background-repeat: no-repeat !important;    
    background-size: cover !important;
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.8);
    box-shadow:none;
    background: url("/img/bg/Websiteheader1.png") black;
    background-attachment:scroll;   
    min-height:150px;
}
*/
.footerBackground,#backgroundimagefooter
{
    background-position: top top 50%;
    background-color: black !important;
    background-repeat: no-repeat !important;    
    background-size: cover !important;
   /* box-shadow: inset 0 0 0 1000px rgba(0,0,0,.5);*/
    box-shadow:none;
    /*background: url("/img/bg/PlayFactoryBallPool.jpeg") black;*/
    /*background: url("/img/bg/blackPolka.jpg") black;*/
    background-color:black;
    background-attachment: fixed;   
    min-height:150px;
}
.footerBackground, #backgroundimagefooter {
    /* background: url("/img/bg/PlayFactoryFooter.jpeg") black;*/
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.7);
    background:none;
}
#divlogo .logoToResize
{
    max-height:240px;
}
.top-bar, .top-bar-section ul li,.top-bar-section ul li a:hover, .top-bar-section ul li.active > a,.contain-to-grid,.top-bar-section
{
    
    background-color: #F1F31E !important ;
    color:black; 
    font-family: Arial;
     font-weight: bold;
    
}
.top-bar-section ul li a
{
    color:white !important;

}



.top-bar-section ul li a:hover
{
    /*color: #A77FC6 !important;*/
    box-shadow:inset 10px black;
}


.BtnStyle1, button,.BtnStyle1a
{
    
     -moz-box-shadow:    inset 0 0 2px #000000;
   -webkit-box-shadow: inset 0 0 2px #000000;
   box-shadow:         inset 0 0 2px #000000;
   background-color:rgb(180,90,211);
}

a
{
    color: #0F75BC ;
    font-weight:900;
}

.menuFont
{
    color: black ;
}
.top-bar .toggle-topbar.menu-icon a
{
       color: black ;
}
.top-bar .toggle-topbar.menu-icon a span::after
{
   box-shadow: 0 0px 0 1px black  , 0 7px 0 1px black , 0 14px 0 1px black ;
}
.ui-datepicker-month,.ui-datepicker-year
{
    color:white;
}
.ui-state-default ui-state-highlight ui-state-active
{
    color:black;    
}
select
{
    background-color:#0F75BC !important ;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-widget-header
{
    border: 1px solid  #0F75BC !important;
    background-color:  #0F75BC !important;
}

    html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active
    {        
      
      
      color:black !important;
      font-weight:bold;
    }

    ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
	color: white !important;	
   /* background-color: #A77FC6 !important;*/
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
	color: white !important;	
	text-decoration: none;
       /*background-color: #A77FC6 !important;*/
}
.ui-datepicker-next, .ui-datepicker-prev, .ui-icon
{
    color: white !important;
}


  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="date"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  input[type="month"]:focus,
  input[type="week"]:focus,
  input[type="email"]:focus,
  input[type="number"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="time"]:focus,
  input[type="url"]:focus,
  textarea:focus {
    box-shadow: 0 0 5px #A77FC6 !important;
    border-color: #A77FC6 !important; }
  input[type="text"]:focus,
  input[type="password"]:focus,
  input[type="date"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  input[type="month"]:focus,
  input[type="week"]:focus,
  input[type="email"]:focus,
  input[type="number"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="time"]:focus,
  input[type="url"]:focus,
  textarea:focus {
    background: white;
    border-color: #A77FC6 !important;
    outline: none; }

  /* Timetable */
  
    .div-table{
      
      color:black;             
      background-color:white;                     
    }

    .div-table-row{      
      color:black;
      width:95%;
      border:1px solid black;         
      
      clear:both;
    }
    .div-table-col{      
      color:black;      
     /* background-color:black;  */
    }
    .div-table-cell
    {        
        border: 1px solid DarkGrey;        
    }
    
    .div-table-cell-heading
    {    
        border: 1px solid black;
    }
    .div-table-cell
    {
        border: 1px solid rgb(180,90,211);
        background-color: rgb(180,90,211);
        color:white;       
    }
    .div-table-cell,.div-table-cell-heading
    {
        border: 1px solid black ;                
        
    }
    .div-table-cell:hover
    {
        border: 1px solid ;
        background: black;
        color:white;        
    }
    .div-table-cell-heading
    {
    
        background:black;
        color: white;
        border: 1px solid black; 
    }
/* .fa-calendar
{
    color:#453452;
}*/

.expanded .top-bar-section ul li .dropdown a:hover
{
    /*color: yellow !important;*/
    
}


.div-table-cell:not(.div-table-cell-empty):hover {
    border: 1px solid #A77FC6;
    background: #A77FC6;
    color: White;
    padding: 20px 3px 20px 3px;
    border-collapse: collapse;
}

@media only screen and (max-width: 40em)
{
    .top-bar-section ul li > a,  li h5 a
    {
        /*background-color: #453452;*/
        color: white;
    }
    .expanded .top-bar-section ul li > a:hover, .expanded li h5 a:hover
    {
     /*   color: yellow !important;*/
    }
}
.accountHeader img, .accountHeader a, .accountHeader .fa,.telephoneNumberHeading a
{
    color:white;
}
.telephoneNumberHeading a
{
    color: white;
}
.bookingDefaultHeader, .bookingDefaultHeader h1
{
    background-color: #F1F31E !important;
    color: black !important;
}
.bookBackgroundSpacesFree
{
   /* background-color:#453452 !important;*/
}

.top-bar-section ul li:hover:not(.has-form) > a,.menuContainer, .top-bar-section ul li a
{
    color: black !important;
    
  
}

.top-bar-section ul li
{
    /*padding-left:10px;
    padding-right:10px;*/
    /*border-right:1px solid white;*/
}

@media only screen and (min-width: 40.063em)
{
    .top-bar-section .has-dropdown > a:after
    {
        border-color: black transparent transparent transparent !important;
    }
    .top-bar-section .dropdown li:not(.has-form) a:not(.button) 
    {
        background-color:black;
        background-color:#F1F31E;
        
    }
    .top-bar-section .dropdown li
    {
         border: none;
    }
        .top-bar-section .dropdown li a,        .top-bar-section .dropdown li a:hover
        {
            /*border: solid 1px white;*/
            border:none;
        }

}


.top-bar.expanded,.top-bar,.menuContainer, .top-bar.expanded ul li a,.top-bar.expanded ul li 
{
    background-color:#F1F31E;
    border:none;
}
.top-bar.expanded ul li h5 a
{
    text-align:left;
    font-family:Arial;
    font-weight:normal;
    border:none;
}
.top-bar.expanded ul li h5
{
    border:none;
}

.parkSwitchText
{
    color:white;
}

/*.menuTopContainer

{
    border-bottom:solid;
    border-color:#FDD306;
    border-width:5px;
}
    */

.wave-container {
  width: 100%;
  height: 100px;
  overflow: hidden;
}

.wave {
  display: block;
  position: relative;
  height: 40px;
  /*background: #FDD306;*/
  background: black;
}

.wave:before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 100%;
  width: 100%;
  height: 300px;
  background-color: white;
  right: -25%;
  top: 20px
}

.wave:after {
  content: "";
  display: block;
  position: absolute;
  border-radius: 100%;
  width: 100%;
  height: 300px;
  /*background-color: #FDD306;*/
  background-color: black;
  left: -25%;
  top: -240px;
}


/* Make Small Menu Work Properly */
@media only screen and (max-width: 40em)
{
    .headerBackground .logoToResize
    {
        max-width: 35%;
        height: auto;
    }
    .telephoneNumberHeading a {
        font-size: 16px;
        margin-left: 0px !important;
        margin-top: 5px;
        margin-bottom: 5px;
    }

        .telephoneNumberHeading
        {
            margin-top:2px !important;
            margin-bottom:3px !important;
        }
    }