/*------------------------ Green Guestbook Kiosk -- base style sheet --------------------------- */ /* It is modified by the following style sheets based on configuration options Screen Size (guestbook->screensize): _kioskSize0 1024x768 _kioskSize1 1280x1024 Color scheme (guestbook->skin): _kioskSkin0 silver _kioskSkin1 black _kioskSkin2 green _kioskSkin3 blue Text on background: _kioskText0 dark text on light background _kioskText1 light text on dark background ggbGreen (PMS 362) #49a942 rgb(74,170,66) silver: #edeceb rgb(237,236,235) layers - z-index 9 popup buttons 8 popup panel 7 main panel buttons 6 kb button popups 5 kb buttons 1 displayable elements 0 hidden elements */ /*---------------------------------------------------------------------- elements */ html { overflow: auto; } body { margin: 0; font-family: Arial, Helvetica, Sans-Serif; font-size: 11pt; text-align: center; } table { margin: 0; font-family: Arial, Helvetica, Sans-Serif; font-size: 11pt; text-align: left; } h1 { font-family: Franklin Gothic Medium, Verdana, Arial, Sans-Serif; /* Title for each page */ font-size: 18pt; font-weight: normal; margin: 6 0; margin: 38 0 0 0; } h2 { font-family: Franklin Gothic Medium, Verdana, Arial, Sans-Serif; /* Footer for each page - currently not used */ font-size: 14pt; font-weight: bold; } h3 { font-family: Verdana, Arial, Sans-Serif; /* Titles for popups */ font-size: 11pt; font-weight: bold; width:100%; text-align:center; } h4 { font-family: Verdana, Arial, Sans-Serif; /* Calendar headings: 'Today at ...' , etc. */ font-size: 10pt; font-weight: bold; margin: 18 0; font-variant: small-caps; } p { font-size: 11pt; } img { border: 0; } ul, ol { font-size: 11pt; margin: 0 0 0 24px; } li { margin: 0 0 6 0; } a:link { text-decoration: none; color: black; } a:visited { text-decoration: none; color: black; } a:hover { text-decoration: none; color: black; } a:active { text-decoration: none; color: black; } /*---------------------------------------------------------------------- general classes */ .nodisplay { display: none; } .display { display: block; } .hidden { visibility: hidden; } .visible { visibility: visible; } .error { color: #ffaaaa; } /*---------------------- buttons ----------------------*/ .buttonGroup-left { float: left; width:350px; } .buttonGroup-right { float: right; } .button { position: relative; margin: 0; border: none; width: 110; height: 64; text-align: center; float: left; } .button p { position: absolute; top: 23; left: 0; width: 100%; color: white; font-weight: bold; font-size: 11pt; } .button2line { position: relative; margin: 0; border: none; width: 110; height: 64; text-align: center; float: left; } .button2line p { position: absolute; top: 16; left: 0; width: 100%; color: white; font-weight: bold; line-height: 1.1em; font-size: 11pt; } /*---------------------------------------------------------------------- layout */ #layoutMain { position:relative; border:0; padding:0; font-size:11pt; } #layoutBanner { position: absolute; top: 0; left: 0; margin: 0; border: 0; padding: 0; z-index: 0; } #layoutBannerLogo { position: absolute; top: 0; left: 0; margin: 10; border: 0; padding: 0; float: left; } #layoutBannerText { position: absolute; margin: 0; border: 0; padding: 0; text-align: center; width: 100%; } #layoutBannerText h1 { display:inline; } #layoutBannerText h2 { display:inline; font-weight: normal; font-size: 13pt; } #layoutBody { position: absolute; margin: 0; border: 0; padding: 0; text-align:left; z-index: 0; } #layoutKeyboard { position: absolute; margin: 0; border: 0; padding: 0; z-index: 0; } #layoutPopupOverlay { position: absolute; margin: 0; border: 0; padding: 0; z-index: 0; text-align: center; } #layoutFooter { position:absolute; margin: 0; border:0; padding:0; text-align: center; z-index: 0; } #layoutFooter p { width: 100%; text-align: right; margin: -20 23 0 0; font-size: 8pt; font-weight: normal;} #footerMsg { font-size: 8pt; width: 100%; text-align: left; margin: -10 0 0 10; font-size: 8pt; font-weight:normal; } #layoutInitMsg { position:absolute; top:295; left:0; width:100%; height:32; z-index:99; margin:0; border:0; padding:0; text-align:center; font-size:24pt; font-weight:bold; color:#444444; background: #cccccc; } #layoutSoundIcon { position:absolute; } /*---------------------------------------------------------------------- Keyboard & NumberPad */ #keyboard { position: absolute; top: 0; left: 33; width: 888; height: 580; } .keyboardActive { position: absolute; top: 0; left: 0; display: block; } .keyboardInactive { position: absolute; top: 0; left: 0; display: none; } .keyboardEntry { position: absolute; top: 12; left: 65; } #kbSelectOptions { position: absolute; top: -2; left: 259; } #kbSelectOptions table { } #kbSelectOptions td { width: 175; height: 71 ; text-align: center; vertical-align: middle; font-weight: bold; border:none; } #kbEmailAt { position: absolute; top: 304; left: 592; } #kbEmailDot { position: absolute; top: 304; left: 666; } #kbEmailAtLeft { position: absolute; top: 304; left: 147; } #kbEmailDotLeft { position: absolute; top: 304; left: 221; } #kbEmailAtPopup { position: absolute; top: 380; left: 165; } #kbEmailDotPopup { position: absolute; top: 380; left: 221; } #kbField { position: absolute; top: 0; left: 0; width:100%; z-index: 2; font-size: 10pt; vertical-align: middle; } #kbInput { position: absolute; top: 0; left: 0; height: 40; background: none; text-align: left; color: #0000ff; font-weight: bold; } #kbCursor { position: absolute; top: 0; left: 0; height: 40; text-align: left; } #kbCursorText { background: none; color: red; visibility: hidden; font-weight: bold; } #keyboard_Buttons { position: absolute; top: 6; left: 10; width: 940; height: 42; } #entry_NextPrev { position: absolute; top: 92; left: 0; width: auto; } #keyboard_Prompt { position: absolute; top: 25; left: 140; width: 608; text-align: center; font-weight: bold; font-size: 14pt; color: white; } #keyboard_Input { position: absolute; top: 120; left: 135; width: 625; height: auto; border:none; background:white; text-align:left; overflow:auto; font-family: Arial, Helvetica, Sans-Serif; font-size: 14pt; font-weight: bold; } #keyboard_Zipcode { position: absolute; top: 120; left: 335; width: 225; height: auto; border:none; background:white; text-align:left; overflow:auto; font-family: Arial, Helvetica, Sans-Serif; font-size: 14pt; font-weight: bold; } #iBar { position: absolute; top: 120; left: 135; z-index:5; } #keyboard_InputLeft { position: absolute; top: 50; left: 135; width: auto; height: auto; border:none; background:white; text-align:left; overflow:auto; font-family: Arial, Helvetica, Sans-Serif; font-size: 14pt; font-weight: bold; } #keyboard_InputRight { position: absolute; top: 80; left: 135; width: auto; height: auto; border:none; background:white; text-align:left; overflow:auto; font-family: Arial, Helvetica, Sans-Serif; font-size: 14pt; font-weight: bold; } #keyboard_Login { position: absolute; top: 120; left: 130; width: 635; height: 28; color:white; font-family: Arial, Helvetica, Sans-Serif; font-size: 14pt; font-weight: bold; text-align: center; } #kb_text1 { position:absolute; top:2; left:3; background:transparent; width:auto; white-space:pre; overflow:auto; } #kb_text2 { position:absolute; top:2; left:3; background:transparent; width:auto; white-space:pre; overflow:auto; color:transparent; } #kb_text3 { position:absolute; top:0; left: 0; width:274; height:28; background:white; font-size:12pt; padding:6 0 0 3; text-align:left;} #kb_text4 { position:absolute; top:0; left:315;width:274; height:28; background:white; font-size:12pt; padding:6 0 0 3; text-align:left;} #keyboard_Explain { position: absolute; top: 65; left: 87; width: 720; text-align: center; font-weight: bold; font-size: 12pt; color: white; } #keyboard_Keyboard { position: absolute; top: 175; left: 0; width: 888; height: 380; } #keyboard_Field { position: absolute; top: 50; left: 139; width: 520; } /*----------------------------------------------------------------------popup */ #popup { display:none; position: absolute; margin: 0; border: 0; padding: 0; width: 523; height: 355; z-index: 9; } #popupBody { position: absolute; top: 15; left: 15; width: 492; height: 325; padding: 30; text-align: left; background: url('../images/kioskBg_Mask.png') repeat; z-index: 9; } .popup1Button { position: absolute; top: 256; left: 204; padding: 0; } .popup2Buttons { position: absolute; top: 256; left: 148; padding: 0; } #popupLg { display:none; position: absolute; margin: 0; border: 0; padding: 0; width: 575; height: 550; z-index: 9; } #popupLgBody { position: absolute; top: 15; left: 15; width: 545; height: 520; padding: 30; text-align: left; background: url('../images/kioskBg_Mask.png') repeat; z-index: 9; } .popupLg1Button { position: absolute; top: 456; left: 225; padding: 0; } .popupLg2Buttons { position: absolute; top: 456; left: 170; padding: 0; } .popupLgSnButtons { position: absolute; top: 456; left: 422; padding: 0; } #popupSm { display:none; position: absolute; margin: 0; border: 0; padding: 0; width: 265; height: 180; z-index: 9; } #popupSmBody { position: absolute; top: 15; left: 15; width: 235; height: 150; padding: 0; text-align: left; background: url('../images/kioskBg_Mask.png') repeat; z-index: 9; } .popupSm1Button { position: absolute; top: 88; left: 70; padding: 0; } .popupSm2Buttons { position: absolute; top: 88; left: 10; padding: 0; } /*----------------------------------------------------------------------pgHome */ #pgHome_Panel { position: absolute; margin: 0; border: 0; padding: 0; z-index: 2; } #pgHome_Buttons { position: absolute; margin: 0; border: none; font-weight: bold; color: white; } #pgHome_Buttons .lgButton { position: relative; margin: 15 0; border: none; width:200; height: 135; text-align: center; } #pgHome_Buttons .lgButton p { position: absolute; top: 44; left: 0; width: 100%; text-align: center; font-size: 15pt; } #pgHome_Welcome { position: absolute; border: none; padding: 30px; text-align: left; margin: 0; font-size: 12pt; font-weight: normal; background: url('../images/kioskBg_Mask.png') repeat; } #pgHome_Welcome img { float:right; margin: 0px 0px 20px 20px; margin: 0px; } #pgHome_Welcome ul, ol { font-size: 12pt; margin: 12px 0 0 24; } #pgHome_Welcome p { margin: 0px; } #pgHome_Events { overflow: hidden; clear: both; } #pgHome_Events ul { font-size: 11pt; font-weight: normal; margin: 0 0 0 24; } #pgHome_Events li { margin: 0 0 12 0; } #pgHome_EventsEnd { position: absolute; } #pgHome_EventsScroll { position:absolute; z-index:10; background-color:rgb(224,224,224); width:32; } #pgHome_EventsScrollUp { position:absolute; left:-32; left:-12; top:-12; z-index:11; } #pgHome_EventsScrollDn { position:absolute; left:-32; left:-12; z-index:11; } /*----------------------------------------------------------------------pgMap */ #pgMap_Body { position: absolute; background-repeat: repeat; } #pgMap_Instr { position: absolute; } #pgMap_Numpad { position: absolute; height: 550; width: 575; } #pgMap_Numpad .entry { position: absolute; top: 40; left: 180; width:222; text-align:center; font-size: 12pt; color:white; font-weight:bold; } #pgMap_Numpad .entry input { font-weight: bold; font-size: 12pt; width: 120; } #pgMap_Numpad .keyboard { position: absolute; top: 145; left: 100; } #pgMap_NumpadBtn { position: absolute; left: 20; top: 10; } #pgMap_Buttons { position: absolute; top: -9; margin: 4; border: none; z-index: 9; } #pgMap_Select { position: absolute; width: 180px;} .popupCell { width: 128; height: 64; } .popupCell img { float:left; vertical-align: text-bottom; margin-left:12; } .popupCell a { margin-left:12px; text-align: left; } #pgMap_Numpad { position: absolute; width: 523; height: 355; } #pgMap_Numpad .entry { position: absolute; top: 25; left: 150; font-size: 12pt; color:white; font-weight:bold; } #pgMap_Numpad .entry input { font-weight: bold; font-size: 12pt; width: 120; } #pgMap_Numpad .keyboard { position: absolute; top: 75; left: 150; } #pgMap_Numpad { position: absolute; width: 575; height: 550; } #pgMap_Numpad .entry { position:absolute; top:35; left:135; height:550; width:300px; text-align:center; font-size:12pt; color:white; font-weight:bold; } #pgMap_Numpad .entry input { font-weight:bold; font-size:14pt; width:110; height:30; } #pgMap_Numpad .keyboard { position:absolute; top:195; left:188; left:98; } /*----------------------------------------------------------------------pgEntry */ /*----------------------------------------------------------------------pgDone */ #pgDone_Visitors { position: absolute; top:0; left: 0; background-repeat: repeat; padding: 60 20 20 20; text-align: center; } #pgDone_Visitors td { border-bottom: solid 1px rgb(224, 224, 224); } #pgDone_Buttons { position: absolute; top: -4; left: 4; border: none; z-index: 8; } #pgDone_Message { position: absolute; top: 10; left: 0; border: none; z-index: 8; text-align:center; font-weight:bold;} #pgDone_InfoHeader { position: absolute; text-align:left; } #pgDone_InfoHeader table { font-size: 11pt; width: 100%; } #pgDone_InfoHeader tr { vertical-align: top; } #pgDone_InfoHeader th { padding-top:8; padding-bottom:8; font-size:11pt; background-color: rgb(240,240,240); } #pgDone_InfoPanel { position: absolute; overflow: auto; } #pgDone_InfoPanel table { font-size: 11pt; width: 100%; } #pgDone_InfoPanel tr { vertical-align: top; } #pgDone_InfoPanel td { padding-top:8; padding-bottom:8; background: rgb(250,250,250); background: white; } #pgDone_InfoPanel th { padding-top:8; padding-bottom:8; font-size:11pt; background-color: rgb(240,240,240); } #pgDone_InfoScroll { position:absolute; background-color: rgb(240,240,240); z-index: 2; } #pgDone_InfoScrollUp { position:absolute; z-index: 9; } #pgDone_InfoScrollDn { position:absolute; z-index: 9; } #pgDone_Guestbooks { position: relative; float: right; background-repeat: repeat; padding: 8 10; text-align: center; } #pgDone_Guestbooks p { width:100%; font-size: 11pt; font-weight: bold; text-align: center; } .ggb { position: relative; width: 180; height: 105; } .ggb p { position: absolute; top: 22; left:0; width: 100%; height: 100%; color: white; font-size: 11pt; font-weight: bold; text-align: center; } #pgDone_SearchPanel { position: absolute; text-align:left; display:none; x-index:7; } /*----------------------------------------------------------------------pgOffline */ #pgOffline_Panel { position: absolute; margin: 0; border: 0; padding: 0; z-index: 2; } /*----------------------------------------------------------------------pgLogin */ #pgLogin { position:absolute; top: 0; left: 0; width: 1024; height: 768; margin: 0; border:0; padding:0; } #pgLogin { position:absolute; top: 0; left: 0; width: 1024; height: 768; margin: 0; border:0; padding:0; } #pgLogin_Fields { position: absolute; top: 0; left: 12; width: 982; height: 300; font-size: 9pt; } #pgLogin_Fields table { position: absolute; top: 0; left: 0; width: 994; font-size: 9pt; } #pgLogin_Fields input { border: solid 1 #aaaaaa; font-size: 12pt; width: 350; height: 32; } #pgLogin_Fields textarea { border: solid 1 #aaaaaa; width: 350; height: 90; font-family: Verdana, Arial, Helvetica, Sans-Serif; } #pgLogin_Fields .selected { color: #0000ff; background: #f3f2f1; font-size: 12pt; } #pgLogin_Fields .notselected { color: #000080; background: white; font-size: 12pt; } #pgLogin_Fields p { position: absolute; top: 218; left: 0; width: 994; margin:0; font-size:8pt; color: dimgray; } #pgLogin_Keyboard { position: absolute; top: 235; left: 75; width: 994; height: 356; } #pgLogin_Callout { position: absolute; top: 22; left: 422; width: 400; height: 170; z-index: 1; } #pgLogin_Callout img { position: absolute; top: 0; left: 0; z-index: 0; } #pgLogin_Input { position: absolute; top: 90; left: 0; width: 100%; text-align: center; color: white; font-weight: bold; font-size: 12pt; } #pgLogin_Input input { width: 150; border: none; font-size: 13pt; color: black; text-align: left; }