﻿/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/


/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 1.5em;
    color: #000;
}

h1 {
    font-size: 2em;
    padding-bottom: 0;
    margin-bottom: 0;
}

h2 {
    padding: 0 0 10px 0;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

header, #header {
    position: relative;
    margin-bottom: 0px;
    /*color: #000;*/
    padding: 0;
}

header h1, #header h1 {
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
    /*color: #fff;*/
    border: none;
    line-height: 2em;
    font-size: 32px !important;
    text-shadow: 1px 1px 2px #111;
}

#main {
    padding: 30px 30px 15px 30px;
    border-radius: 4px 0 0 0;
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
}

footer, 
#footer {
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 0 0 30px 0;
    font-size: .9em;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
}

.clear {
    clear: both;
}

.clearAfter:after{
	content:'';
    display:block;
    clear: both;
}

.errorBorder
{
    border: 1px solid red;
}

ul.error li:hover
{
    cursor: pointer;
}
.link:hover
{
	cursor:pointer;
	text-decoration:underline;
}
.error
{
    color: Red;
    list-style-type: none;
    width: 100%;
    text-decoration: underline;
}

#errorLists 
{
    width: 100%
}

nav, 
#menucontainer {
    margin-top: 40px;
}

div#title {
    display: block;
    float: left;
    text-align: left;
}

#logindisplay {
    font-size: 1.1em;
    display: block;
    text-align: right;
    margin: 10px;
    color: White;
}

#logindisplay a:link {
    color: white;
    text-decoration: none;
}

#logindisplay a:visited {
    color: white;
    text-decoration: none;
}

#loginheader a:hover {
    color: white;
    text-decoration: underline;
}

.dropDownPadding{
    padding: 0.4em 2.1em 0.4em 1em;
}


/* Styles for scroll bars
-----------------------------------------------------------*/
::-webkit-scrollbar {
    width: 12px;
}
 
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
 
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(5,5,5,5); 
}
/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label, 
.editor-label {
    margin: 1em 0 0 0;
}

.display-field, 
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

.text-box.multi-line {
    height: 6.5em;
}

.tri-state {
    width: 6em;
}


div.form
    {
     width:40%;   
     padding-left:20%;
    }

.ButtonLink 
{
    color: White; 
    cursor:pointer; 
    text-decoration:none;
}

.ButtonLink:hover 
{
    text-decoration: underline;
}

.Hidden 
{
    display: none;
}

#ProductForm label 
{
    display: block;
    margin-bottom: 6px;
}

#ProductForm label > span
{
    font-weight: bold;
}

#ProductForm input[type=text] 
{
    width: 350px;
}

#ProductForm textarea 
{
    width: 350px;
    height: 80px;
}

/**********************************************************************************************************************
 HomePage style
**********************************************************************************************************************/
#BookingArea
{
    
    background-color: #3B4246;
    color: #FFFFE0;
    width:80%;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:50px;
    font-family: Verdana;
    font-size: 9pt;
    padding-left: 5px;
    padding-right: 5px;
    min-height: 300px;
    min-width: 600px;
}

#BookingHeader
{
    background-color: #3B4246;
    color: #FFFFE0;
    width:80%;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:10px;
    font-family: Verdana;
    font-size: 9pt;
    padding-left: 5px;
    padding-right: 5px;
    min-height: 50px;
    min-width: 600px;
}



#BookingLinks ul 
{
    margin: 0; 
    padding: 0; 
	list-style-type: none; 
	list-style-image: none;
	width:100%; 
	
}
	
#BookingLinks li 
{
    display: inline; 
    width:20%;	
}
#BookingLinks a
{
    width:130px;
}
#BookingLinks ul li a:hover 
{
	cursor:pointer; 
}


#BookingEntry
{
    clear:both;
    padding-top: 10px;
    margin: 0px auto;
    width: 80%;
}

#BookingDate
{
    float:left;
}

#BookingNights
{
    float:left;
}

#BookingNumGuests
{
    float:left;
}

#BookingPromoCode
{
    float:left;
}

#BookingDetails
{
    height:400px;
    width:80%;
    margin-left:auto;
    margin-right:auto;
    font-family: Verdana;
    font-size: 9pt;
    padding-left: 5px;
    padding-right: 5px;
    overflow: hidden;
}

input.MediumTextbox
{
    width: 100px;
}

input.SmallTextbox
{
    width:50px;
}

select.SmallSelectBox
{
    width:50px;
}

.RefreshButton
{
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

/***********************************************************************************************************************
Restaurant MyAccount page
***********************************************************************************************************************/
#RestauntMyAccountLinksContainer
{
	height:285px;
}
#NavigationMyAccountBack
{
	width:46%;
	float:left;
	margin-left:4px;
}
#NavigationMyAccountNewBooking
{
	width:46%;
	float:right;
	margin-right:4px;
}
.myAccountListButton
{
	margin-bottom:20px;
}
#RestauntMyAccountLinksContainer ul
{
	list-style-type: none;
	padding-left:5%;
}

#MyAccountSurround
{
	height:380px;
	width:305px;
	position:absolute;
}

#MyAccountPageTitle
{
    padding-left:5%;
}

/**********************************************************************************************************************
 Details style
**********************************************************************************************************************/

#PersonalDetails
{
    margin-left:5%;
    width:45%;
    padding:50px;

}

#DetailsForm #Register
{
     float:right;
     padding:5px;
}


/**********************************************************************************************************************
 MyBookings style
**********************************************************************************************************************/
/*table {
    border-collapse: collapse;   
}
 tr {
    background-color: #eee;
    border-top: 1px solid #fff;
}
 tr:hover {
    background-color: #ccc;
}
 th {
    background-color: #fff;
}*/
 th, #example td {
    padding: 3px 5px;
}
 td:hover {
    cursor: pointer;
}
.assignedTableRow
{
    opacity:0.5;
	filter:Alpha(opacity=50); /* IE8 and earlier */
}
/**********************************************************************************************************************
 Login popup
**********************************************************************************************************************/
 
#loginInstructions
  {
      text-align:center;
      padding-bottom:1px;
  }
  
.loginMain
  {
      width:90%; /* was 30%? */
      padding-left:5%;
      padding-top:2%;
      /* border: 1px solid red */
  }
.loginHeader
  {
      background-color:Gray;
      width:40%;
      height:50px;
  }
  #title
  {
      color:White;
      text-align:center;
      padding-left:20%;
      width:25%;
      padding-top:3%;
  }
  
  #instructions
  {
    width:250px;
  }
  
#loginInsturctions table 
  {
    border-collapse: collapse;
    border-width:0px;
  }

#loginInsturctions table td 
  {
    padding: 5px;
    border-width:0px;
  }

#loginInsturctions table th 
  {
    padding: 6px 5px;
    text-align: left;
    background-color: #e8eef4;
    border-width:0px;
  }
  
  #MyAccountLink
  {
      color: White;
  }
  
  #MyAccountLink:hover
  {
      text-decoration: underline;
      cursor: pointer;
  }
  
  
/**********************************************************************************************************************
 Personal Details
**********************************************************************************************************************/

#bookingSummary
{
    float:right;
    margin-top:50px;
    margin-right:50px;
    margin-left:100px;   
}



/**********************************************************************************************************************
 Restaurant container 
**********************************************************************************************************************/
#restaurantContainer
{
    width:305px;
    height: 419px;
    background-color: #EEEEEE;
    overflow: hidden;
}

#loginBanner
{
    width: 99%;
    height: auto;
    background-color: #bbbbbb;
}

#restaurantContainer #contentHolder
{
    width: 100%;
    height: 345px;  /* was 378px */
}

/***********************************************************************************************************************
 Restaurant main page (index - selection venue, covers, session and date)
***********************************************************************************************************************/

label, select,.ui-select-menu
{
    float: left;
    margin: 2px;
}

.ui-selectmenu-menu 
{
    /*required to make JQuery ui selectlists appear on dialog boxes*/
    z-index : 1205 !important;
}

#LabelVenue
{
    padding-top: 15px;
    padding-left: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    height: 12px;
}

#LabelValidation
{
    padding-left: 10px;
    height: 20px;
}

.LabelError
{
    display: block;
    color: Red;
    font-weight: bold;   
    width: 100%;
    text-align: center;
}

#SelectionVenue
{
    padding-left: 5%;
    padding-right: 5%;
    width: 90%;
    height: 35px;
}

#DropDownVenues
{
    width: 100%;
}

#LabelSeatsAndSession
{
    padding-top:15px;
    padding-left: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    height: 12px;
}

#SelectionSeatsAndSession
{
    padding-left: 5%;
    padding-right: 5%;
    width: 90%;
    height: 35px;
}

#AvailabilityCheckingBlock .ui-datepicker
{
	margin: 0px auto;
}

#SelectionSeats
{
    width: 30%;
    float:left;
}

#DropDownSeats
{
    width: 95%;
}

#SelectionSessions
{
    width: 70%;
    float:right;
}

#DropDownSessions
{
   width: 100%;
}

#CalendarSelection
{
    height: auto;
}

#SelectionAmendSeatsAndSession 
{
    margin: 10px 0px !important;
}

#BookingSubmit
{
    width: 305px;
    height: 30px;
    margin-left: 5%;
    margin-right: 5%;
    width: 90%;
    /* vertical-align: bottom; */
}

#ButtonSubmitBook, #ButtonSubmitBookJSON
{
    width: 100%;
    vertical-align: bottom;
}

/***********************************************************************************************************************
 Restaurant main page (Calendar - date format for available, closed, past etc.)
***********************************************************************************************************************/


/***********************************************************************************************************************
 Restaurant time Selection page 
***********************************************************************************************************************/
#SelectTimeSurround
{
    text-align: center;
    /*border: 1px solid Black;*/
    padding: 2px 2px 2px 2px;
    width: 73%;
    /*height: 200px;*/
    margin: 0px auto;
    /*overflow: auto;*/
}

#surround
{
    height: 345px;
    overflow: auto;
}

#LabelSummary
{
    text-align: center;
    height: 20px;
    padding: 5px;  
}

#LabelInstructions
{
    text-align: center;
    height: 67px;
    padding: 10px;
    margin: 0px auto;
    width: 90%;
	clear:both;
}

.TimeButton
{
    width: 74px;
    /*height: 30px;*/
    height: 24px;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-Left: 0px;
    margin-right: 0px;
    vertical-align: middle;
	font-size:100%;
	padding-top:2px !important;
	padding-left:2px !important;
	float:left;
}
.Telephone
{
	background-image:url('../Images/phone.png') !important;
	background-repeat:no-repeat !important;
}

#BackSubmit
{
    padding-left: 5px;
    padding-right: 5px;
}

#ButtonBack
{
    width: 100%;
    vertical-align: bottom;
}

/**********************************************************************************************************************
 Password Amendment page
**********************************************************************************************************************/


#RestaurantPasswordAmend #SubmitFormControlSurround
{
    width:100%;
    height:320px;
}

#RestaurantPasswordAmend #NavigationPasswordUpdate
{
    width:100%;
    height:25px;
	text-align:center;
}

#ButtonGuestPasswordUpdateCancel
{
    height:100%;
    width:100px;
    float:left;
}
#ButtonGuestPasswordUpdateSave
{
    height:100%;
    width:100px;
    float:right;
}

/*#passwordErrDisplay
{
    margin-top: 30px;
}*/

/***********************************************************************************************************************
 Restaurant Guest detail page
***********************************************************************************************************************/
#LabelUserDetails
{
    padding-top: 20px;
    padding-left: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

#restaurantBookingInsert
{
    height: 320px;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
	clear:both;
}

#UserDetailsSurround
{
    height:320px;
    width:100%;
    overflow-y:auto;
    overflow-x:hidden;
}

#LabelNotesDetail
{
    height: 16px;
    width: 98%;
}

#LabelNotesEntry
{
    height: 50px;
    width: 96%;
}

#LabelNotes
{
    padding-top: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    width: 100%;
}

#TextAreaNotes, #InputFieldNotes
{
    width: 96%;
}
/*#InputFieldNotes
{
    width: 270%;
    height:40%;
}*/

#MarketingArea
{
    padding-left: 3px;
    height: auto;
    float:left;
    clear: both;
}

#SaveDetailsArea
{
    margin: 10px 0px;
    padding-left: 3px;
    float:left;
    height: auto;
	clear:both;
}

#MarketingArea .ui-checkbox, #SaveDetailsArea .ui-checkbox {
    float:left;
}

#SaveDetailsExpandingArea
{
    /*padding-left: 10px;*/
    /*padding-right:10px;*/
    /*padding-top:55px;*/
    /*height: 20px;*/
}

#SaveDetailsInnerArea .FormInput 
{
    float: left;
}

.GuestEntryItem
{
    width: 94%;
    float: none;
    padding:5%;
}

.GuestEntryLabel
{
    float: left;
    width: 100%;
    text-align: left;
    vertical-align: middle;
    padding: 5px;
    overflow:hidden;
}

.GuestEntryControl
{
    float: left;
    margin-left:2%;
    width: 35%;
    text-align: left;
    vertical-align: middle;
}
.GuestEntryControl select 
{
    padding-left: 0px;
}

.GuestEntryMediumBox
{
    width: 160px !important;
    height: 24px;
    padding-left: 3px;
    box-sizing: border-box;
}

.GuestEntrySmallBox
{
    width: 120px;
    height: 24px;
}

.GuestEntrySmallBoxInput
{
    width: 105px;
    padding-left:1em;
    height: 24px;
}

#DropDownTitles
{
    width: 120px;
}

#DropDownGenders
{
    width: 120px;
}

#Navigation
{
    padding-left: 7px;
    padding-right: 5px;
    height: 20px;
}

#ButtonGuestBack
{
    width: 48%;
}

#ButtonGuestNext
{
    width: 48%;
}

#SignUpMessage
{
    padding-top:4px;
}

#ChangePasswordMessage:hover
{
    text-decoration: underline;   
}

#emailUsedDialog
{
    display: none;
}

/***********************************************************************************************************************
 Restaurant Card detail page
***********************************************************************************************************************/
#LabelPaymentDetails
{
    padding-left: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

#FieldErrDisplay
{
    margin-top: 0px;
}

#FieldErrDisplay li:after
{/*This is not how this should be done. The .clearAfter class should be applied to the li's on generation*/
    content:'';
    display:block;
    clear: both;
}

/***********************************************************************************************************************
Restaurant MyBookings page
***********************************************************************************************************************/

#myBookingsDivScroll
{
    height:305px;       /* was 327px */
    width:98%;
    margin-left:1%;
    margin-bottom:20px;
    overflow-y:scroll;
    overflow-x:hidden;
}


.Cancel img
{
    margin-left:10px;
}
.Edit img
{
    margin-left:5px;
}
.Date
{
    width:20%;
    padding:0;
}
.Venue
{
    width:20%;
    padding:0;
    text-align:center;
    overflow:hidden;
}
.Time
{
   text-align:center;
}

.Covers
{
    width:8%;
    margin:0;
    padding:0;
    text-align:center;
    overflow:hidden;
}

#myBookingsBackButton
{
    width:98%;
    padding-left:1px;
    height:25px;
}

.imageButtonCancel:hover, .imageButtonEdit:hover
{
    cursor:pointer;
}

/***********************************************************************************************************************
amend booking page
***********************************************************************************************************************/
#amendBookingTime
{
    /*display:none;*/
}

#amendBooking{
    height:auto !important;
}

#SelectionAmendSessions
{
    float:right;
	width:125px;  /* Wasnt in V27_2 */
 }

#surroundAmend
{
    height: auto;
    overflow: visible;
    padding:5px;
} 
#amendBooking
{
	overflow:hidden;
}
#amendBookingDetails
{
    height: auto;
    overflow: visible;
}

#CalendarAmendSurround
{
    text-align: center;
}

#CalendarAmendSurround #CalendarSelection .ui-datepicker {
    margin: 0px auto;
}

#SelectAmendTimeSurround
{
    text-align: center;
    /*border: 1px solid Black;*/
    /*padding: 2px 2px 2px 2px; */
    /*width: 90%;*/
    width: 230px;
    height: 150px;
    margin: 0px auto;
    overflow-y: auto;
	overflow-x: hidden;
	/*padding-left: 40px; */
}

#ChangeTimeSubmit
{
	margin-top: 10px;
}

.DivButton:hover
{
    cursor:pointer;
}
.DivButton
{
    height: 25px;
    text-align:center;
}
.DivButton a
{
    padding: 10px;
}

#surroundAmend .DivButton 
{
    height: auto !important;
    padding: 5px 0px;
}
#surroundAmend .DivButton a {
    padding: 0px 0px !important;
}

#ChangeDetailsSubmit
{
	position:absolute;
	width:90%;
	top:282px;
}
#NavigationAmendBooking
{
	position:absolute;
	top:265px;
	width:264px;
	text-align:center;
}

.TimeButton span 
{
    padding: 0px !important;
}

/***********************************************************************************************************************
 Restaurant summary detail page
***********************************************************************************************************************/
#LabelSummaryInstruction
{
    padding-top: 15px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
}

#SummaryDetailSurround
{
    text-align: center;
    border: 1px solid #DDDDDD;
    padding: 2px 2px 2px 2px;
    width: 90%;
    height: 120px;
    margin: 0px auto;
    overflow: auto;
}

#SummaryArea
{
    height: 320px;
}

.SummaryEntryItem
{
    width: 90%;
    float: none;
    height: 28px;
}

.SummaryEntryLabel
{
    float: left;
    width: 30%;
    text-align: right;
    vertical-align: middle;
    padding: 5px;
}

.SummaryEntryResult
{
    float: left;
    width: 60%;
    text-align: left;
    vertical-align: middle;
    font-weight: bold;
    padding: 5px;
}

#SummaryNavigation
{
    padding-left: 7px;
    padding-right: 5px;
    height: 20px;
}

#ButtonSummaryBack
{
    width: 48%;
}

#ButtonSummaryBook
{
    width: 48%;
}

/***********************************************************************************************************************
 Restaurant booking confirmed page
***********************************************************************************************************************/

#ConfirmationArea
{
    height:80%;
}
#Confirmation
{
    height:100%;
}
#ConfirmationDetailSurround
{
    text-align: center;
    border: 1px solid #DDDDDD;
    padding: 2px 2px 2px 2px;
    width: 90%;
    height: 165px;
    margin: 0px auto;
    overflow: auto;
}

.ButtonDefaultNavigation
{
    width:45%;
}
#ButtonSendEmail
{
    width:95%;
    height:auto;
    text-align:center;
    margin-left:2.5%;
    margin-top:20px;
}
#ButtonConfirmNewBooking
{ 
    margin-left:20%;
    width:60%;
}
#FindUsLinkSurrond
{
    font-weight:bold;
    width: 80%;
    margin: 0px auto;
    padding-top: 10px;
}

#linkFindUs:hover
{
    cursor:pointer;
}

.ConfirmationEntryItem
{
    width: 90%;
    float: none;
    height: 30px;
    padding:2px;
}

.ConfirmationEntryResult
{
    float: left;
    width: 40%;
    text-align: left;
    vertical-align: middle;
    padding: 5px;
}

.ConfirmationEntryLabel
{
    float: left;
    width: 45%;
    text-align: right;
    vertical-align: middle;
    font-weight: bold;
    padding: 5px;
    clear: both;
}

/***********************************************************************************************************************
 Restaurant Booking Failed 
***********************************************************************************************************************/
#LabelErrorDetail
{
    padding-top: 5px;
    padding-left: 10px;
    padding-bottom: 5px;
    padding-right: 10px;
    text-align: center;
    height: 330px;
    position: relative;
    
}

#ErrorMessage
{
    position: absolute;
    top: 50%;
    height: 10em;
    margin-top: -5em;
}

#ErrorNavigation
{
    padding-left: 7px;
    padding-right: 5px;
    height: 35px;
}

#ButtonErrorReset
{
    width: 100%;
}
/***********************************************************************************************************************
 Restaurant Addition Email Confirmation
***********************************************************************************************************************/

#SelectBoxEmailAddress, #CheckBoxEmailSelfSurround
{
    width:270px;
    max-height:60px;
}


#EmailConfirmationNavigation
{
    width:270px;
    height: 80px;
    margin-left:17.5px;
}
#SelectAreaSurround
{
    width:280px;    
    margin-left:17.5px;
    padding-top:5px;
	max-height:130px;
	overflow-y:hidden;
	overflow-x:auto;
    
 }
 #CustomMessageSurround
{
    margin-left:17.5px;
    width:270px;
    padding-top:20px;
}
 #MessageToUser
 {
    width:270px;
    height: 80px;
    margin-left:17.5px;
    padding-top:5px;
 }

#AddAddressSurround
{
    padding-top:10px;
    margin-left:17.5px;
    width:270px;
}


#ButtonAddAddress
{
    float:right;
    height:27px;
	margin-right:0px;
}
#TextBoxNewEmailAddress
{
    width: 200px;
	height: 25px;
    text-align:center;
    margin-left:2px;
}

.buttonRemoveAddress
{
	padding:0px 5px 0px 5px;
	height:17px;
	width:8px;
	line-height:17px;
	float:right;
}

.rightColumn .ui-checkbox
{
	margin-right:0px;
	float:right;
}

#SelectBoxEmailAddress .leftColumn
{
	padding-left:5px;
}

#SelectBoxEmailAddress .rightColumn, #CheckBoxEmailSelfSurround .rightColumn
{
	width:47px;
	text-align:center;	
	float:right;
}

#TextAreaEmailMessage
{
    width:264px;
    height:100px;
}


#ButtonEmailConfirmBack
{
    width:40%;
}
#ButtonEmailConfirmSubmit
{
    float:right;
    width:40%;
}


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label, 
.editor-label {
    margin: 1em 0 0 0;
}

.display-field, 
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

.text-box.multi-line {
    height: 6.5em;
}

.tri-state {
    width: 6em;
}
#InputFieldTitle
{ 
    width:160px;
}

/*.error
{
    color: White;
    list-style-type: none;
    text-decoration: underline;
    font-weight: bold;
}*/

/*#errorLists .error
{
    color: Red;
}*/

/*.text-emphasis
{
    font-weight: bold;
    color: #602001;
    text-decoration: none;
}*/

/*.text-emphasis-link
{
    text-align-decoration: none;
}*/

/*Form input layout
/*--------------------------------------------*/

.FormInput
{
   width:90%;
}

.FormElementLabel
{
    display: inline-block;
    width:40%;
    background-color:Aqua;
}

input.error 
{
 border-color:red;
 background-color:#FFFFD5;
 border-style:solid;
 border-width:1px;
}

.error label
{
    /*width:70%;*/
    width: 90%
}

#ErrDisplay
{
    padding-left: 20px;
    text-align:left;
    width:100%;
}

/*#FieldErrDisplay
{
    overflow:hidden;
}*/

#InputFieldTitle-menu, #InputFieldCounty-menu, #InputFieldCountry-menu, #InputFieldNationality-menu, #inputFieldSource-menu
{
    height: 110px; overflow: auto; 
}

/* Restaurant Payment styles ---------------------------------------*/
#PaymentDetailsInsert
{
    width: 100%;
}

.InputRow
{
    width: 92%;
    float: none;
    height: 22px;
    padding: 10px;
    text-align: left;
    vertical-align: middle;
	margin:0;
}

.InputMediumLabel
{
    float: left;
    width: 100%;
    overflow: hidden;
}

.GuestEntryMediumBox
{
    width: 160px !important;
    height: 24px;
}

.GuestEntryMediumBoxInput
{
    width: 145px !important;
    padding-left: 1em;
    height: 24px;
}

#restaurantBookingInsert #GuestEntry
{
	height:auto;
}

#NavigationPayButtons
{
    /*width: 60px;
    padding-top: 300px;
    margin-left: auto;
    margin-right: auto;*/
    height: 20px;
    padding-left: 7px;
    padding-right: 5px;
}

#PaymentOuterSurround
{
    height: 320px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
}

.PaymentEntryItem
{
    float: none;
    height: 22px;
    padding-top: 2%;
    padding-bottom: 2%;
    padding-left: 5%;
    padding-right: 5%;
}

#BookingDetailSurround
{
  padding-top: 5px;  
}

#buttonPaymentBack
{
    width: 48%;
}

#buttonPaymentNext
{
    width: 48%;
}


.restaurantErrorBody
{
	width:80%;
	margin:auto;
	padding:5px;
}
@media(max-width:350px){
 .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable{
width:80% !important;

}   
}
