html {height : 100%;} 

@font-face {
    font-family: "F1";
    src: url('FrutigerNeueLTPro.woff') format("opentype");
}
@font-face {
    font-family: "F2";
    src: url('FrutigerNeueLTPro-Thin.ttf') format("truetype");
}
@font-face {
    font-family: "F3";
    src: url('FrutigerNeueLTPro.otf') format("opentype");
}
  
P
{
    FONT-SIZE: 12pt;
}
H1
{
    FONT-WEIGHT: bold;
    FONT-SIZE: x-large;
/*    color: #9fdfff */
}
H2
{
    FONT-WEIGHT: bold;
    FONT-SIZE: medium
}
H3
{
    MARGIN-TOP: 0px;
    FONT-WEIGHT: bold;
    FONT-SIZE: 12pt;
    MARGIN-BOTTOM: 0px;
    COLOR: #224499;
}
H4
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
}
A
{
    FONT-SIZE: 14px;
    COLOR: #1d485b;
    TEXT-DECORATION: underline
}
A:visited
{
    COLOR: #1d485b;
    TEXT-DECORATION: underline
}
A:active
{
    COLOR: #1d485b;
    TEXT-DECORATION: underline;
}
A:hover
{
    COLOR: #ff6600;
    TEXT-DECORATION: underline
}
BODY
{
    height: 100%;
    text-align: center;
    FONT-SIZE: 12pt;
    font-family: "F2","F1",Verdana,Geneva,sans-serif;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: White;
    background-image: url('../image/bodybg.jpg');
}

input, select
{
      font-family: "F2","F1",Verdana,Geneva,sans-serif;
}

TD
{
    text-align: left;
    FONT-SIZE: 12pt;
}

TD.progressBarComplete
{
	background-color: #000044;
}
TD.progressBarRemaining
{
	background-color: #EFEFFF;
}
.progressBar
{
	background-color: #F9F9F9;
}

FORM
{
    FONT-SIZE: 12pt;
}
.small
{
    FONT-SIZE: 8pt;
}
LI
{
    FONT-SIZE: 12pt;
}
UL
{
    FONT-SIZE: 12pt;
}
.nounderline
{
    FONT-WEIGHT: bold;
    TEXT-DECORATION: none
}
.sbtext
{
    FONT-WEIGHT: bold;
    MARGIN-BOTTOM: 5pt;
    COLOR: #224499
}
.nu
{
    FONT-SIZE: 8pt;
    TEXT-DECORATION: none
}
.highlit
{
    FONT-WEIGHT: bold;
    COLOR: #0033aa
}
.title
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 16pt;
    COLOR: #330099;
}
.email
{
    COLOR: #0000ff
}
.Titlebar
{
    FONT-SIZE: 12px;
    COLOR: #003366;
    VERTICAL-ALIGN: top;
}
.CPUBigHeading
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 16px;
}
.textField
{
  border: 0px;
  font-size: 12pt;
}
.textField:hover 
{
  background-color: #cbedfe;
}

.textFieldNoEdit
{
    FONT-SIZE: 12pt;
}
.textFieldNumeric
{
    FONT-SIZE: 12pt;
    TEXT-ALIGN: right
}

.textFieldNumericNoEdit {
	FONT-SIZE: 12pt; TEXT-ALIGN: right; background-color: #F8F8F8
}
.textFieldNoBorder
{
    FONT-SIZE: 12pt;
    padding: 2px;
    margin: 0px;
    border-style: none;
    border-width: thin;
}
.textLabel
{
    FONT-SIZE: 12pt;
}
.textNonEdit
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 12pt;
    TEXT-DECORATION: underline
}
.textLabelHeading
{
    FONT-WEIGHT: 900;
    FONT-SIZE: 12pt;
}
.tabText
{
    FONT-SIZE: 12pt;
    TEXT-DECORATION: none
}
.textFieldNoBorder
{
    FONT-SIZE: 12pt;
    padding: 2px;
    margin: 0px;
    border-style: none;
    border-width: thin
}
.textFieldNoBorderBlue
{
    FONT-SIZE: 12pt;
    color: Blue;
    padding: 2px;
    margin: 0px;
    border-style: none;
    border-width: thin
}
.textFieldNoBorderRed
{
    FONT-SIZE: 12pt;
    color: Red;
    padding: 2px;
    margin: 0px;
    border-style: none;
    border-width: thin
}
TD.pmPanelHead
{
    FONT-SIZE: 8pt;
    FONT-WEIGHT: 900;
    border-bottom : solid 1 highlight;
    padding : 8 0 0 0;
    white-space : nowrap;
}

TD.pmPanelFoot
{
    FONT-SIZE: 8pt;
    FONT-WEIGHT: 900;
    border-top : solid 1 highlight;
    padding : 0 0 8 0;
    white-space : nowrap;
}

TD.pmPanelBody
{
    FONT-SIZE: 8pt;
    FONT-WEIGHT: 900;
    padding : 8 0 8 0;
    white-space : nowrap;
}

TD.pmMessageArea
{
    FONT-SIZE: 8pt;
    FONT-WEIGHT: 900;
    color : darkred;
    padding : 0 0 0 0;
    white-space : nowrap;
    border-top : solid 1 highlight;
}

.messageArea
{
    FONT-SIZE: 8pt;
    FONT-WEIGHT: 900;
    color : darkred;
    padding : 0 0 0 0;
    white-space : nowrap;
}

.bigwarning
{
    FONT-SIZE: 10pt;
    padding : 0 0 0 0;
    white-space : nowrap;
}

.pleaseSaveSmall {
  color: red;
  FONT-SIZE: 8pt;
	position: absolute;
	top:120px;
	left:520px;
	zIndex: 1;
	}
.pleaseSaveBig {
  FONT-SIZE: 10pt;
	position: absolute;
	top:120px;
	left:520px;
  FONT-WEIGHT: 900;
  color : red;
	zIndex: 1;
	}



.pmButton
{
    color : White;
    background-color : Highlight;
    width : 60px;
}

.pmWideButton
{
    color : White;
    background-color : Highlight;
    white-space : nowrap;
}

.pmDroplist
{
    width : 50%;
}
.bgcolorStatus
{
    background-color: #f0f0f0;
}

.loginButton, .loginButtonHover, .registerButton, .registerButtonHover, 
.confirmButton, .confirmButtonHover
{
  cursor: pointer;
  width: 110px;
  height: 27px;
}
.loginButton
{
  background-image: url('../image/butLogin.png');
}
.loginButtonHover
{
  background-image: url('../image/butLoginHover.png');
}
.registerButton
{
  background-image: url('../image/butSubmit.png');
}
.registerButtonHover
{
  background-image: url('../image/butSubmitHover.png');
}
.confirmButton
{
  background-image: url('../image/butConfirm.png');
}
.confirmButtonHover
{
  background-image: url('../image/butConfirmOver.png');
}
.sendNewPassword, .sendNewPasswordHover
{
  cursor: pointer;
  width: 200px;
  height: 27px;
}
.sendNewPassword
{
  background-image: url('../image/butSendNewPassword.png');
}
.sendNewPasswordHover
{
  background-image: url('../image/butSendNewPasswordOver.png');
}


.bodyPublic
{
    height: 100%; text-align: center;
    FONT-SIZE: 12pt;
}

.loginImage
{
  height: 99.7%;
  display:inline-block; 
  width:65%; 
  background-image: url('../image/theO2b.jpg');
  background-repeat: no-repeat; 
  background-position: center bottom;
  background-size: cover;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.loginFields
{
  width:25%; display: inline-block;
  padding: 30px 20px 50px 50px;
  vertical-align: top;
}

.fieldSeparator
{
  padding-bottom: 26px;
}

.fieldTitle
{
  padding-bottom: 6px;
}

.publicButton
{
  background-color: #0f1f7f;
  color: White;
  border: 1px solid grey;
  height: 30px;
  font-size: 14pt;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  padding: 10px 10px 10px 10px;
  cursor: pointer;
  display: inline-block;
}

.publicButton:hover
{
  background-color: #3a52e2;
  color: White;
  border: 1px solid black;
}


.dashboardContainer
{
  display: block; 
  width: 100%;
  border-bottom: 1px solid #e0e0e0;
  padding-top: 16px;
  text-align: left;
}

.dashboardContainerTable
{
  display: table; 
  width: 100%;
  border: 0px solid gray;
}

.dashboardContainerTableRow
{
  display: table-row; 
  width: 100%;
  height: 99.5%;
  border: 1px solid green;
}

.dashboardMenu
{
  height: 100%;
  display: table-cell; 
  width:20%; 
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  background-color: White;
  vertical-align: top;
  border: 0px solid red;
}

.dashboardButtons
{
  width:75%; 
  height: 100%;
  display: table-cell;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  background-color: #f0f0f0;
  vertical-align: top;
  height: 99.7%;
  border: 0px solid yellow;
}

.dashboardMenuHeader
{
  width: 100%;
  height: 80px;
  background-image: url('../image/o2bubblesSmall.png');
  background-repeat: no-repeat; 
  background-position: left top;
  /*background-size: cover;*/
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.dashboardButtonsHeader
{
  width: 100%;
  height: 60px;
  background-color: White;
  padding: 20px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  vertical-align: middle;
  display: inline-block;
  border: 0px solid red;
}

.dashboardMenuItem
{
  color: #0f1e83;
  padding: 10px 5px 10px 15px;
  display: block;
  cursor: pointer;
}

.dashboardMenuItem:hover
{
  background-color: #dadffe;
}

.dashboardMenuItemText
{
  padding: 10px 0px 0px 0px;
  display: inline-block;
}

.dashboardMenuItemImage
{
  padding: 0px 15px 0px 0px;
  float:right;
}

.dashboardSearch
{
  width: 70%;
  display: table-cell;
  padding-right: 20px;
}

.dashboardSearchField
{
  height: 25px;
  width: 100%;
  background-image: url('../image/search.png');
  background-repeat: no-repeat; 
  background-position: left middle;
  padding: 3px 3px 3px 25px;
  margin: 0px 0px 0px 20px;
  border: 1px solid #bec1de;
}

.dashboardLoggedInAs
{
  border: 1px solid #bec1de;
  display: table-cell;
  width: 29%;
  text-align: right;
  margin: 5px 20px 0px 0px;
  padding-right: 15px;
  border: 0px solid #bec1de;
  cursor: pointer;
}

.dashboardLoggedInAs:hover
{
  background-color: #dadffe;
}

.dashboardButtonsInner
{
  width: 100%;
  height: 100%;
  vertical-align: top;
  display:block;
  border: 0px solid red;
}

.dashboardButtonsInnerRow
{
  display:table-row;
}

.dashboardButton, .dashboardButtonRed, .dashboardButtonGreen, .dashboardButtonYellow
{
  width: 28%;
  height: 300px;
  background-image: url('../image/o2DashboardButton.jpg');
  background-repeat: no-repeat; 
  background-position: center bottom;
  background-size: cover;
  padding: 20px 20px 20px 20px;
  margin: 0px 10px 10px 0px;
  color: White;
  font-size: 24pt;
  display: table-cell;
  cursor: pointer;
  border: 1px solid white;
  vertical-align: top;
}

.dashboardButtonRed
{
  background-image: url('../image/o2DashboardButtonRed.jpg');
}

.dashboardButtonGreen
{
  background-image: url('../image/o2DashboardButtonGreen.jpg');
}

.dashboardButtonYellow
{
  background-image: url('../image/o2DashboardButtonYellow.jpg');
}

.dashboardButton:hover
{
  opacity: 0.8;
  filter: alpha(opacity=80);
  border: 1px solid black;
}

.dashboardFooter
{
  padding: 5px 5px 5px 15px;
  color: #808080;  
  font-size: 10pt;
}

.eventsTableContainer
{  
  width: 100%;
  padding: 20px 20px 20px 20px;
  display: block;
}

.eventsTable
{
  width: 96%;
  display: table;
  background-color: White;
}

.eventsTableRow
{
  display: table-row;
  border: 0px solid green;
}

.eventsTableCell
{
  display: table-cell;
  width: 30%;
  padding: 10px 20px 10px 10px;
  border: 0px solid yellow;
  text-align: left;
  vertical-align: top;
}

.eventsTableCellContents
{
  display: block;
  width: 100%;
  padding: 0px 0px 0px 0px;
  border: 1px solid #A0A0A0;
  cursor: pointer;
  min-height: 340px;
  position: relative; 
}

.eventsTableCellContents:hover
{
  opacity: 0.8;
  filter: alpha(opacity=80);
  border: 1px solid black;
}

.eventsTableCellDate
{
  font-size: 12pt;
  color: #606060;
  padding: 0px 0px 0px 10px;
}

.eventsTableCellTitle
{
  font-size: 14pt;
  color: Black;
  padding: 8px 0px 8px 10px;
}

.eventsTableCellInstruction
{
  font-size: 14pt;
  color: White;
  padding: 0px 0px 0px 0px;
  background-color: #0d1f85;
  position: absolute; 
  width: 100%;
  bottom: 0px;
}

.eventsTableCellInstructionInner
{
  padding: 8px 0px 8px 10px;
}

.eventsTableCellShortDescription
{
  font-size: 12pt;
  color: Black;
  padding: 8px 0px 8px 10px;
}

.eventsTableCellConfirmation
{
  font-size: 14pt;
  font-weight: bold;
  color: Black;
  padding: 28px 0px 8px 10px;
  line-height: 24pt;
}

.eventDetails
{
  padding: 20px 20px 20px 20px;
  border: 1px solid #a0a0a0;
}

.dashboardGeneralField
{
  height: 25px;
  padding: 2px 2px 2px 2px;
  margin: 0px 0px 0px 0px;
  border: 1px solid #bec1de;
  font-size: 12pt;
}

.mainBodyContainer
{
  display: block;
  width: 100%;
  border: 0px solid black;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  text-align: center;
}
.mainBody 
{
  display: inline-block;
  width: 1110px;
  border: 0px solid red;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  text-align: center;
}
.mainBodyImage
{
  display:block; width: 1110px; margin: 0px 0px 0px 0px; border: 0px 0px 0px 0px;
}

.mobileMenu
{
	display: none;
}

.topMenuContainer
{
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  width: 100%;
  background-color: #82DCFA;
  color: White;
  text-align: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  vertical-align: top;
  height: 48px;
  font-size: 14pt;
  border: 0px solid red;
}
.topMenuItem, .topMenuItemSelected, .topMenuItemClicked, .topMenuItemSelectedClicked {
	height: 26px;
	text-align: left;
	display: inline-block;
	width: 169px;
	border-top: 1px solid white;
	border-right: 1px solid white;
	padding: 10px 2px 10px 20px;
	margin: 0px 0px 0px 0px;
	background-image: url('../image/topBarArrowRight.png');
	background-position: right;
	background-repeat: no-repeat;
	background-color: #82DCFA;
	cursor: pointer;
	vertical-align: top;
	-webkit-flex: 1;
	flex: 1;
}
.topMenuItem:hover, .topMenuItemFinal:hover, .topMenuItemClicked:hover
{
  background-color: #0050FF;
}
.topMenuItemSelected, .topMenuItemSelectedClicked
{
  background-color: #00008C;
  background-image: url('../image/topBarArrowDown.png');
}
.topMenuItemFinal, .topMenuItemFinalClicked
{
  text-align: left;
  display: inline-block;
  width: 138px;
  height: 26px;
  font-size: 10pt;
  border-top: 1px solid white;
  padding: 12px 2px 10px 10px;
  margin: 0px 0px 0px 0px;
  background-image: url('../image/topBarUser.png');
  background-position: right;
  background-repeat: no-repeat;
  cursor: pointer;
  vertical-align: middle;
}

.dashboardItem, .dashboardItemClear
{
  height: 65px;
  text-align: left;
  display: block;
  padding: 20px 10px 10px 10px;
  margin: 0px 0px 15px 0px;
  cursor: pointer;
  vertical-align: top;
  width: 98%;
  border: 0px solid yellow;
  background-color: White;
  color: Black;
  vertical-align: middle;
  font-size: 20pt;
}

.dashboardItemClear
{
  display:inline-block; 
  width: 50%; 
  background-color: #cfdde9;
}

.dashboardItem:hover, .dashboardItemClear:hover
{
  background-color: #0050FF;
  color: White;
}

.dashboardPulldown
{
  text-align: left;
  display: block;
  padding: 10px 10px 10px 10px;
  margin: 10px 0px 15px 20px;
  vertical-align: top;
  width: 95%;
  border: 0px solid yellow;
  background-color: White;
  color: Black;
  font-size: 14pt;
}

.dashboardPulldownItem
{
  padding: 0px 0px 0px 0px;
  height: 60px;
  width: 100%;
  border-bottom: 1px solid #c0c0c0;  
  border-left: 1px solid #c0c0c0;  
  border-right: 1px solid #c0c0c0;  
  cursor: pointer;
  vertical-align: top;
}
.dashboardPulldownItem:hover
{
  background-color: #0050FF;
  color: White;
}


.dashboardNumber, .dashboardNumberGreen, .dashboardNumberClear
{
  margin-left: 10px;
  width: 45px;
  height: 45px;
  padding-top: 10px;
  background-color: red;
  color: White;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  display: inline-block;
}

.dashboardNumberGreen
{
  background-color: green;
}

.dashboardNumberClear
{
  background-color: white;
  color: Black;
  border: 1px solid grey;
}

.dashboardText
{
  height: 30px;
  vertical-align: middle;
  display: inline-block;
  padding-left: 20px;
}

.secondMenuContainer
{
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  width: 100%;
  color: black;
  text-align: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  vertical-align: top;
  font-size: 18pt;
  margin-top: 10px;
  height: 95px;
  border: 0px solid red;
}
.secondMenuItemContainer, .secondMenuItemContainerSelected
{
  height: 91px;
  text-align: left;
  display: inline-block;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  cursor: pointer;
  vertical-align: top;
  border-right: 4px solid #f0f0f0;
  width: 100%;
  -webkit-flex: 1;
  flex: 1;
  border: 0px solid yellow;
}

.secondMenuItemInner, .secondMenuItemInnerSelected
{
	width: 94%;
	background-color: white;
	border-right: 0px solid red;
	margin-right: 10px;
	text-align: left;
	padding-left: 15px;
  background-image: url('../image/topBarArrowRight.png');
  background-position: right;
  background-repeat: no-repeat;
}
.secondMenuItemInner:hover, .secondMenuItemFinal:hover
{
  background-color: #0050FF;
  color: White;
}
.secondMenuItemInnerSelected
{
  background-color: #82DCFA;
  color: White;
  background-image: url('../image/secondMenu.png');
}

.secondMenuItem, .secondMenuItemSelected
{
  height: 77px;
  text-align: left;
  display: block;
  width: 100%;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  cursor: pointer;
  vertical-align: top;
  line-height: 78px;
  /*background-color: white;*/
  /*border: 1px solid blue;*/
}
.secondMenuItem
{
  background-image: url('../image/secondMenu.png');
  background-position: right;
  background-repeat: no-repeat;
}

.secondMenuItemLower, .secondMenuItemLowerSelected
{
  height: 14px;
  text-align: center;
  display: inline-block;
  width: 100px;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  background-position: bottom;
  background-repeat: no-repeat;
  vertical-align: top;
}
.secondMenuItemLowerSelected
{
  background-image: url('../image/secondMenuSelected.png');
}

.searchContainer
{
  height: 68px;
  text-align: right;
  display: inline-block;
  width: 405px;
  padding: 10px 10px 0px 0px;
  margin: 0px 0px 0px 0px;
  cursor: pointer;
  vertical-align: top;
  background-color: White;
  vertical-align: middle;
  border: 0px solid red;
  -webkit-flex: 1;
  flex: 1;
  border: 0px solid yellow;
}
.search
{
  font-size: 14pt;
  width: 320px;
  height: 55px;
  background-image: url('../image/search.png');
  background-position: right;
  background-repeat: no-repeat;
  padding: 0px 0px 0px 70px;
  border: 0px;
}

.events2Container
{
  position: relative;
  width: 365px;
  height: 477px;
  display: inline-block;
  background-color: White;
  color: #10153f;
  text-align: left;
  vertical-align: bottom;
  margin: 0px 5px 5px 0px;
}

.events2ImageContainer
{
  width: 365px;
  height: 215px;
  overflow: hidden;
}

.eventTitle
{
  font-size: 20pt;
  padding: 20px 0px 0px 20px;
}

.eventDetailsTitle
{
  font-size: 20pt;
  padding: 0px 0px 0px 0px;
}

.eventStart
{
  font-size: 14pt;
  padding: 20px 0px 0px 20px;
}
.eventDeadline
{
  font-size: 14pt;
  padding: 6px 0px 0px 20px;
}

.centeredFlexbox
{
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  justify-content: center;
}

.leftFlexbox
{
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: left;
  justify-content: left;
}
.flexboxItem
{

  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.eventGeneralButton, .eventGeneralButtonRed, .eventGeneralButtonSmall, .eventGeneralButtonSmallRed {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	background-color: #82DCFA;
	background-image: url('../image/eventGeneralButton4.png');
	background-position: right;
	background-repeat: no-repeat;
	width: 188px;
	height: 50px;
	cursor: pointer;
	border: 0px;
	font-size: 24pt;
	color: white;
	text-align: left;
}
.eventGeneralButtonSmall, .eventGeneralButtonSmallRed
{
  height: 50px;
  font-size: 20pt;
}
.eventGeneralButton:hover, .eventGeneralButtonSmall:hover
{
  background-color: #0050FF;
  background-image: url('../image/eventGeneralButton4Over.png');
}

.eventGeneralButtonTextHolder {
	display: inline-block; /* for old ie */
	display: table;
	width: 100%;
	height: 100%;
}

.eventGeneralButtonText {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
}

.eventGeneralButtonImage {
	display: table-cell;
	vertical-align: middle;
	padding-right: 5px;
	padding-top: 5px;
}

.eventGeneralButtonImageSmall {
	display: table-cell;
	vertical-align: middle;
	padding-right: 5px;
	padding-top: 5px;
}

.eventGeneralButtonRed, .eventGeneralButtonSmallRed
{
  background-color: #fb4b4b;
  background-image: url('../image/eventGeneralButtonRed.png');
  background-position: right;
  background-repeat: no-repeat;
}
.eventGeneralButtonRed:hover, .eventGeneralButtonSmallRed:hover
{
  background-color: #fc6969;
  background-image: url('../image/eventGeneralButtonRedOver.png');
}


.eventButtonContainer
{
  font-size: 14pt;
  padding: 16px 0px 0px 20px;
  position: absolute;
  bottom: 5px;
}
.eventButton, .continueButton, .bookGuestsButton
{
  background-image: url('../image/book.png');
  background-position: right;
  background-repeat: no-repeat;
  width: 188px;
  height: 40px;
  cursor: pointer;
  border: 0px;
}
.eventButton:hover
{
  background-image: url('../image/bookOver.png');
}
.continueButton 
{
  background-image: url('../image/continue.png');
}
.bookGuestsButton 
{
  background-image: url('../image/bookGuests.png');
}
.eventFooter
{
  background-color: #00008C;
  color: White;
  margin-top: 10px;
  padding: 20px;
}

.bookingRequestMask
{
  width: 100%;
  height: 1600px;
  position:fixed;
  top: 0px;
  left: 0px;
  background-color: #4a4a6d;
  opacity: 0.8;
  filter: alpha(opacity=80); /* For IE8 and earlier */
  display: none;
  text-align: center;
}

.bookingRequest
{
  width: 100%;
  height: 95%;
  position:fixed;
  top: 0px;
  left: 0px;
  display: none;
  text-align: center;
}

.bookingRequestInner
{
  max-width: 900px;
  height: 95%;
  background-color: white;
  display: inline-block;
  margin-top: 30px;
  overflow-y: auto;
}
.bookTableCell
{
  font-size: 14pt;
}

.bookInput, .bookSelect, .bookInputSmall, .bookInputSmallList
{
  background-color: #f8f8f8;
  font-weight: bold;
  width: 250px;
  border: 1px solid #cccccc;
  font-size: 16pt;
  padding: 6px;
  height: 40px;
}

.bookInputSmall, .bookInputSmallList
{
  font-size: 12pt;
  padding: 3px;
  height: 20px;
}

.bookInputSmallList
{
  height: 28px;
}

.bookSelect
{
  background-image: url('../image/selectArrow.png');
  background-position: right;
  background-repeat: no-repeat;
   width: 240px;
}

.styled-select {
   width: 120px;
   height: 40px;
   overflow: hidden;
   background: url(../image/selectArrow.png) no-repeat right #f8f8f8;
   border: 1px solid #edeced;
   display: inline-block;
   }

.styled-select select 
{
   display: inline-block;
   background: transparent;
   width: 148px;
   padding: 5px;
   font-size: 16px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 40px;
   -webkit-appearance: none;
   font-weight: bold;
}

.bookTableHeader
{
  font-weight: bold;
  font-size: 16pt;
}

.error
{
  font-weight: bold;
  font-size: 16pt;
  color: red;
  padding: 12px 0px 12px 0px;
}

.confirmation
{
  font-weight: bold;
  font-size: 16pt;
  color: blue;
  padding: 12px 0px 12px 0px;
}

.popUpDataEntryTitle
{
  font-size: 20pt; 
  padding-bottom: 20px;
}

.divBookDetails
{
  font-size: 18pt; 
  padding-top: 20px; 
  display: block;
}

.sendTo, .sendToInline
{
  font-size: 14pt; 
  display: block;
  padding-bottom: 3px; 
}

.sendToInline {
	display: inline-block;
}

.largeSelect
{
  font-size: 18pt; 
}

#divBookDetails, #divLogin
{
  font-size: 18pt; 
  padding-top: 20px; 
  display: block;
}

.calendarFrame
{
  position: relative;
  font-size: 8pt;
  background-color: #FDF6B3;
  border-style: solid;
  border-width: 1px;
  z-index: 9999999;
}
.calendarDayOutsideMonth
{
  background-color: #EEEEEE;
  color: #777777;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  cursor: default;
  text-align: center;
}
.calendarDayToday
{
  background-color: #FFFFFF;
  font-weight: bold;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  cursor: pointer;
  text-align: center;
}
.calendarDaySelected
{
  background-color: #882222;
  color: #FFFFFF;
  font-weight: bold;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  cursor: pointer;
  text-align: center;
}
.calendarDay
{
  background-color: #FFFFFF;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  cursor: pointer;
  text-align: center;
}
.calendarWeekend
{
  background-color: #DDDDFF;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  cursor: pointer;
  text-align: center;
}
.calendar
{
  font-size: 8pt;
  vertical-align: middle;
  text-align: center;
}
.calendarOver
{
  background-color: #4444AA;
  border-top-style: solid;
  border-left-style: solid;
  border-width: 1pt;
  border-color: #CCCCCC;
  color: #FFFFFF;
  cursor: pointer;
  text-align: center;
}
.icoCalendarHolder
{
  display: inline-block;
  border: 1px solid #cccccc;
  border-left: 0px;
  height: 40px;
  background-color: #eeeeee;
  width: 40px;
  text-align: center;
}

.tabsContainer
{
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  width: 100%;
  background-color: #82DCFA;
  color: White;
  text-align: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  vertical-align: top;
  min-height: 48px;
  font-size: 14pt;
  border: 0px solid red;
}
.tabsItem, .tabsItemSelected, .tabsItemClicked, .tabsItemSelectedClicked
{
  text-align: left;
  display: inline-block;
  width: 169px;
  border-top: 1px solid white;
  border-right: 1px solid white;
  padding: 10px 2px 10px 20px;
  margin: 0px 0px 0px 0px;
  cursor: pointer;
  vertical-align: top;
  -webkit-flex: 1;
  flex: 1;
}
.tabsItem:hover, .tabsItemFinal:hover, .tabsItemClicked:hover
{
  background-color: #0050FF;
}
.tabsItemSelected, .tabsItemSelectedClicked
{
  background-color: #00008C;
}
.tabsBody
{
  display: inline-block;
  width: 100%;
}

.selectDate
{
	padding-top: 6px;
	font-weight: bold;
	font-size: 16pt;
}

.selectDateRow
{
	padding: 6px 6px 6px 6px;
	font-weight: bold;
	cursor: pointer;
}
.selectDateRow:hover
{
    background-color: #8eb7cb;
}

.detailsLine
{
	padding-top: 6px;
}

.requestsTable
{
  font-size: 14pt;
}

.requestsSubTable
{
  font-size: 14pt;
}

.requestsTableHeaderRow
{
  font-weight:bold;
}

.requestsTableHeaderCell, .requestsTableHeaderCellRight, .requestsTableHeaderCellCenter
{
  border-bottom: 1px solid #c0c0c0;
  padding: 8px 8px 8px 0px;
  vertical-align: bottom;
}
.requestsTableHeaderCellRight
{
  text-align: right;
}
.requestsTableHeaderCellCenter
{
  text-align: center;
}
.requestsTableRow
{
  color: #aaaaaa;
  width: 100%;
}

.requestsTableCell, .requestsTableCellRight, .requestsTableCellRightCancelled, .requestsTableCellClickNumber, .requestsTableCellClickNumberRed, .requestsTableCellPointer, .requestsTableCellCancelled, .requestsTableCellPointerCancelled, .requestsTableCellClickNumberCancelled, .requestsTableCellCentre {
	color: black;
	border-bottom: 1px solid #c0c0c0;
	padding: 8px 8px 8px 0px;
}

.requestsTableCellCancelled
{
  text-decoration: line-through;
}

.requestsTableCell:hover, requestsTableCellRight:hover, .requestsTableCellClickNumber:hover, .requestsTableCellClickNumberRed:hover, requestsTableCellPointer:hover, requestsTableCellClickNumberCancelled:hover
{
  background-color: #cbedfe;
}

.requestsTableCellRight
{
  text-align: right;
}

.requestsTableCellCentre {
	text-align: center;
}

.requestsTableCellPointer, .requestsTableCellPointerCancelled {
	cursor: pointer;
}
.requestsTableCellClickNumber, .requestsTableCellClickNumberRed
{
  text-align: center;
  width: 60px;
  cursor: pointer;
}

.requestsTableCellClickNumberRed
{
  background-color: #ffacac;
}

.tableInput, .tableInputNumeric, .tableInputRed
{
  color: black;
  border: 0px;
  font-size: 12pt;
}
.tableInput:hover, .tableInputNumeric:hover, .tableInputRed:hover
{
  background-color: #cbedfe;
}
.tableInputRed {
	color: red;
}
.tableInputNumeric {
		text-align: right;
	}

.tableInputNumericCancelled, .textFieldCancelled, .requestsTableCellRightCancelled, .tableInputCancelled, .requestsTableCellPointerCancelled, .requestsTableCellClickNumberCancelled
{
  text-decoration: line-through; border: 0px;
}

.requestsTableForm
{
	width: 99%;
}

.requestsTableTitle
{
	width: 100%;
	background-color: #030335;
	color: white;
	margin-top: 10px;
	margin-right: 20px;
	font-size: 20pt;
	padding: 6px 6px 6px 6px;
}

.popUpDataEntrySub
{
  position: absolute;
  left: 10%;
  top: 10%;
  width: 70%;
  height: 70%;
  z-index: 9999999;
  background-color: white;
  border: 1px solid #808080;
  box-shadow: 5px 5px 2px #888888;
  text-align: left;
}

.popUpDataEntrySubContents {
	height: 100%;
	overflow: scroll;
}

.popUpDataEntrySubTitle {
	font-size: 20pt;
	padding: 20px 0px 0px 20px;
}

.popUpDataEntrySubNotes
{
  width: 90%;
  height: 300px;
  margin: 20px 0px 0px 20px;
}

.menuTitle
{
  font-size: 20pt;
  padding: 20px 0px 0px 0px;
}

.leftAlignContainer
{
  text-align: left;
}

.hoverImage
{
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
}
.hoverImage:hover
{
  background-color: #cbedfe;
}
.listSelectRow
{
  padding: 3px 0px 3px 14px;
  font-size: 18pt;
  cursor: pointer;
}
.listSelectRow:hover
{
  background-color: #cbedfe;
}
.venueSelectRow
{
	background-image: url(../image/selectVenueBackground.png);
	background-repeat: no-repeat;
	background-position: left top;
  margin: 0px 0px 20px 50px;
  padding: 3px 0px 3px 20px;
  font-size: 18pt;
  cursor: pointer;
  height: 100px;
  vertical-align: middle;
}
.venueSelectRow:hover
{
	background-image: url(../image/selectVenueBackgroundHover.png);
}

.selectQuantity {
	display: inline-block;
	clear: both;
	vertical-align: top;
}
.selectQuantityButton {
	display: inline-block;
	background-color: #c9c9c9;
	color: #666666;
	width: 40px;
	height: 30px;
	border: 1px solid #c9c9c9;
	border-radius: 3px;
	vertical-align: top;
	text-align: center;
	padding: 0px 0px 0px 0px;
	cursor: pointer;
}
.selectQuantityMinus {
	background-image: url(../image/minus.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.selectQuantityPlus {
	background-image: url(../image/plus.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.selectQuantityEntry {
	display: inline-block;
	background-color: #0185d0;
	color: white;
	font-size: 16pt;
	width: 60px;
	height: 30px;
	border: 1px solid #0185d0;
	border-radius: 3px;
	vertical-align: top;
	text-align: center;
	padding: 0px 0px 0px 0px;
}

@media (max-width: 1100px) {
   /* some CSS for small resolution */
	.loginImage 
	{
	  width: 100%;
	  height: 200px;
	}
	
	.loginLogo 
	{
	  display: none;
	}
	
	.loginFields
	{
	  width: 100%;
	  text-align: center;
	  padding: 0px 0px 0px 0px;
	}
	
	.mainBody 
	{
		width: 100%;
	}
	.mainBodyImage
	{
		width: 100%;
	}
	.mobileMenu
	{
		display:inline-block;
		background-color: #00008C;
		background-image: url('../image/mobileMenu.png');
		width: 48px;
		height: 46px;
		border-top: 1px solid white;
		cursor: pointer;
	}

	.topMenuContainerClicked
	{
		display: block;
		clear: both;
		height: 300px;
		text-align: left;
		background-color: #0975b2;
		color: white;
	}
	.topMenuItemFinal, .topMenuItemFinalClicked
	{
		width: 179px;
	}

	.topMenuItem, .topMenuItemClicked
	{
		display: none;
	}
	.topMenuItemClicked, .topMenuItemSelectedClicked
	{
		display: block;
		clear: both;
		background-color: #00008C;
	}
	.topMenuItemFinalClicked
	{
		display: block;
		clear: both;
		border-right: 1px solid white;
		border-bottom: 1px solid white;
	}
	.secondMenuContainer {
		font-size: 12pt;
	}

}

@media (max-width: 1600px) {
	/* some CSS for small resolution */

	.eventGeneralButtonSmall, .eventGeneralButtonSmallRed {
		font-size: 18pt;
		line-height: 17pt;
	}
}

@media (max-width: 1000px) {
	/* some CSS for small resolution */

	.eventGeneralButtonSmall, .eventGeneralButtonSmallRed {
		font-size: 12pt;
		line-height: 11pt;
	}
}

	@media (max-width: 800px) {
		/* some CSS for small resolution */

		.eventGeneralButtonSmall, .eventGeneralButtonSmallRed {
			font-size: 12pt;
			line-height: 11pt;
		}

		.dashboardMenu {
			width: 100%;
			display: inline-block;
			height: auto;
		}

		.dashboardButtons {
			width: 100%;
			display: inline-block;
		}

		.dashboardSearchField {
			display: inline-block;
			width: 90%;
		}

		.dashboardLoggedInAs {
			display: inline-block;
		}

		.secondMenuItemInner, .secondMenuItemInnerSelected, .secondMenuItem, .secondMenuItemLowerSelected {
			background-image: none;
		}
	}