/* KIPCOM VOIP Portak Style Sheet */
/* Layout */
BODY { margin: 0; }
DIV#innerbody { position: relative; }
@media screen { 
  DIV#innerbody { margin: 25px 30px 0; }
  BODY { margin-bottom: 15px; }
}

DIV#outerheader    { position: relative; height: 87px; }
DIV#outersitemenu  { position: absolute; top: 0; left: 560px; height: 87px; width: 390px; }
DIV#outersubheader { display: none; }
DIV#outerpagemenu  { position: relative; margin: 9px 0; }
DIV#outerbody      { position: relative; margin-top: 15px; clear: both; }
DIV#outerfooter    { position: relative; margin-top: 6px; }

DIV#header, DIV#pagemenu, DIV#body, DIV#footer { position: relative; height: 100%; }
DIV#footer { padding: 5px 0; }
DIV#body { margin-top: 6px; padding: 5px 0 8px 0; }
/* For Popup Menu DIV#header, DIV#sitemenu, DIV#subheader, DIV#body, DIV#footer, DIV#outerheader, DIV#outersitemenu, DIV#outersubheader, DIV#outerfooter { overflow: hidden; } */
DIV#header, DIV#sitemenu, DIV#subheader, DIV#footer, DIV#outerheader, DIV#outersitemenu, DIV#outersubheader, DIV#outerfooter { overflow: hidden; }
/* For Popup Menu @media screen { DIV#outerbody { overflow: hidden; } } */

/* Print Layout */
@media print {
  DIV#outerpagemenu { display: none; }
}

/* Colours */
BODY { background-color: #EEEEEE; color: black; }
.grey { color: gray; }
#header, DIV#body, DIV#footer { background-color: white; color: #383838; } 
#sitemenu, #subheader { color: black; }
A, A:visited, A:active { color : #EB2B8A; }


PRE.scrollable { border: 1px solid black; padding: 5px 7px; }
FORM.subform DIV.controls { background: none; margin: 0; padding: 3px 3px 3px 12em; color: black; }
DIV.controls { background-color: #CCCCCC; color: white; font-weight: bold; }

BODY { background-color: white; }
@media screen {
  BODY { color: #606060; }
  .grey { color: #A0A0A0; }
}
@media print  {
  BODY { color: black; }
  .grey { color: gray; }
}

DIV#footer { border-top: 4px solid #7F7B7D; }

PRE.scrollable { border: 1px solid #808080; }
#body FORM.subform { border-color: #606060; }
#body FORM.subform DIV.controls { color: #606060; }

/* Text: fonts, sizes and weights: */
BODY, P, TH, TD, DT, DD, LI, #subheader H2 { font-family: Arial, Helvetica, sans-serif; font-size: 14px; }
H1, H2, H3, H4, H5, H6, TH { font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
#sitemenu LI { font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 15px; }
#pagemenu H2, #pagemenu P { font-family: Helvetica, sans-serif; font-weight: bold; font-size: 16px; }
#pagemenu LI P { font-family: Helvetica, sans-serif; font-weight: normal; font-size: 14px; }
#header H1 { font-size: 24pt; }
#body DT { font-weight: normal; }
H1 { font-size: 22px; }
H2 { font-size: 18px; }
H3, TH { font-size: 14px; }
H4 { font-size: 11pt; }
H5, H6 { font-size: 9pt; } 
P { text-align: justify; }
PRE, CODE { font-family: "Lucida Console", monospace; }
#footer * { font-size: 12px; }

/* Header: */
#header H1 { margin: 13px 0 0; border: 0; height: 57px; text-indent: -5000px; background: url("http://www.kipcom.org/SiteImages/portallogo.png") no-repeat; }
@media print {
  #header H1 { text-indent: 0; background: none; }
  #header H1:before { content: "Hello Telecom "; }
}

/* Site menu: */
#outersitemenu { background: url("http://www.kipcom.org/SiteImages/contactimg.png") no-repeat; }
#sitemenu { margin: 10px 5px 5px 92px; }
#sitemenu UL { list-style: none; margin: 0; padding: 0; }
#sitemenu LI { margin: 0; }
#sitemenu A { text-decoration: none; }
#sitemenu A:hover { border-bottom: 2px solid #EB2B8A; }

/* Page menu: */
#pagemenu LI { height: 38px; }
#pagemenu LI UL LI { height: 34px; }

#pagemenu LI { background: #8A8A8A url("../hellotelecom3/menuBg.jpg") repeat-x; color: white; }
#pagemenu LI UL { background-color: white; }
#pagemenu LI UL LI { background: #EEE; color: black; }
#pagemenu LI, #pagemenu LI A { font-weight: bold; text-decoration: none; color: white; }
#pagemenu LI UL LI, #pagemenu LI UL LI A { font-weight: normal; text-decoration: none; color: black; }

#pagemenu LI:hover { background: #EB2B8A url("../hellotelecom3/menuBgOver.jpg") repeat-x; color: white; }
#pagemenu LI UL LI:hover { background: #CCC; color: white; }
#pagemenu LI:hover > * > A { color: white; }

#pagemenu LI { margin: 0 5px 0 0; }
#pagemenu LI A { padding: 10px 15px; }
#pagemenu LI UL LI A { padding: 8px 12px; }
#pagemenu A { display: inline-block; }

#pagemenu P, #pagemenu H2 { margin: 0; }

/* Horizontal CSS Dropdown and Popout Menu */
#pagemenu UL { list-style: none; margin: 0; padding: 0; }
#pagemenu LI { position: relative; float: left; }
#pagemenu LI UL LI { width: 100%; }
#pagemenu P, #pagemenu H2 { display: block; }
#pagemenu LI UL { position: absolute; width: 210px; left: 0; top: 38px; z-index: 500; }
#pagemenu UL UL, #pagemenu UL LI:hover UL UL, #pagemenu UL UL LI:hover UL UL { display: none; }
#pagemenu UL LI:hover UL, #pagemenu UL UL LI:hover UL, #pagemenu UL UL UL LI:hover UL { display: block; }

/* Body */
#refresh-indicator { position: relative; margin: 0; padding: 0; }

#body TABLE { margin: 7px 0; }
#body P  { margin: 7px 0; } 

#body UL, #body DL { margin-top: 0.7em; margin-bottom: 0.7em; }
#body LI, #body DD { margin-top: 0.3em; margin-bottom: 0.3em; }

 #body UL.operations LI { height: 24px; }
 #body UL.operations LI UL LI { height: 24px; }
#body UL.operations { list-style: none; position: relative; margin-left: 0; }
 #body UL.operations UL { list-style: none; margin: 0; padding: 0; }
#body UL.operations LI { float: left; position: relative; margin-right: 5px; background: #8A8A8A url("../hellotelecom3/menuBg.jpg") repeat-x center center; color: white; white-space: nowrap; }
 #body UL.operations LI UL { background-color: white; }
 #body UL.operations LI UL LI { background: #EEE; color: black; margin: 0; }
 #body UL.operations LI UL LI, #body UL.operations LI UL LI A { font-weight: normal; text-decoration: none; color: black; }
#body UL.operations LI:hover { background: #EB2B8A url("../hellotelecom3/menuBgOver.jpg") repeat-x center center; color: white; }
 #body UL.operations LI UL LI:hover { background: #CCC; color: white; }
 #body UL.operations LI:hover > * > A { color: white; }
#body UL.operations LI A { display: inline-block; padding: 4px 6px; text-decoration: none; color: white; }
#body UL.operations:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
 #body UL.operations LI UL LI { width: 100%; }
 #body UL.operations P, #body UL.operations H2 { display: block; }
 #body UL.operations LI UL { position: absolute; width: 210px; left: 0; top: 24px; z-index: 500; }
 #body UL.operations UL, #body UL.operations LI:hover UL UL, #body UL.operations UL LI:hover UL UL { display: none; }
 #body UL.operations LI:hover UL, #body UL.operations UL LI:hover UL, #bosy UL.operations UL UL LI:hover UL { display: block; }
 #body UL.operations P, #body UL.operations H2 { margin: 0; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; }

 #body UL.operations LI.dropdownmenu H2:after {  }

/* Footer */

/* Paragraph formatting: */
H1 { margin-top: 12pt; }
.bodysection, H2 { margin-top:  9pt; }
H3 { margin-top:  6pt; }
H4, P, H5, H6, TABLE, LI, DL { margin-top: 3pt; }
H1, H2, H3, H4, P, H5, H6, TABLE, LI, DL { margin-bottom: 3pt; }
.bodysection:first-child H1:first-child, .bodysection:first-child H2:first-child, .bodysection:first-child H3:first-child { margin-top: 3pt; }

/* Miscellanious */
DIV.floatright { margin: 0.5em 1px; padding: 3px 4px; background-color: white; }
DIV#outerdebug { position: relative; clear: both; }
#outerdebug DIV.debugging_messages { position: relative; background-color: white; margin-top: 5px; border: 1px solid #CCCCCC; }