@import url(http://fonts.googleapis.com/css?family=News+Cycle);

body {position:absolute; font-family: Verdana, "Segoe UI", Tahoma, Arial, Helvetica, sans-serif; font-size:70%; margin:0; padding:0; width:100%; text-align:center;}
h1 {font-family: 'News Cycle', sans-serif; text-shadow: 1px 1px 1px #aaa; font-size:290%; font-weight:normal; margin:0; padding:10px 0 0 0; border:0; text-align:left;}
h2 {font-family: 'News Cycle', sans-serif; font-size:125%; font-weight:normal; margin:0; padding:10px 0 6px 0; border:0; text-align:left;}

a img {border: none;}
a:link {border-width: 0px; color:#1560c1;}
a:visited {border-width: 0px; color:#5976BE;}
a:hover   {border-width: 0px; background-color:#EAECF3; color:#5976BE;}
a:active  {border-width: 0px; color:#5976BE;}
p {margin: 0; text-align:justify; line-height: 1.5em; font-size:100%;}

#Header {height:6px; background-color:Black;}
#Page {width:800px; height:500px; margin:0 auto 0 auto; vertical-align:middle; background:white url("../Images/Background.jpg") no-repeat top center;}

.section {}
.sectionHeader { opacity:0;}
.sectionContent { opacity:0; width: 800px;}
#Home {display:none; padding-top: 200px; width: 800px;}
#LogoBullets {height:100px;}
#LogoBullets ul {list-style: none; width:675px; margin:0 auto 0 auto;}
#LogoBullets ul li {color:gray; float: left; font-family: 'News Cycle', sans-serif; text-shadow: 1px 1px 1px #aaa; font-size: 150%; width:225px; text-align:center;}
#About {display:none; padding-top: 50px; width: 800px;}
#About h1, #ODS h1, #Contact h1 {padding:0 0 5px 0; text-align:center; font-size:350%;}
#About h2 {font-size:175%}
.TechList {margin: 0 auto 0 auto; width:600px; height:30px;}
.TechList li {margin:0 0 7px 0;}
.TechList span {font-weight:bold;}
.TechListLeft {float:left; width: 300px; text-align:left;}
.TechListRight {float:right; width: 300px; text-align:left;}
#ODS {display:none; text-align:left; padding-top: 25px; width: 800px;}
#ODSAnnouncement h2 {font-size:150%; text-align:center; color:Red;}
#ODSAnnouncement p {padding:0 0 0 50px; margin:0; color:Red;}
#ODS h1 {padding:0; margin:0 0 5px 0;}
#ODS h2 {font-size:150%; padding:0; margin:0 0 5px 0;}
#ODS h3 {font-size:125%; font-weight:normal; padding:0; margin:15px 0 5px 0;}
#ODS p {margin: 0 0 5px 0;}
.BList {list-style-type: disc; list-style-image: url(../Images/bullet.gif); list-style-position: outside; margin: 5px 0 0 30px; padding: 0; text-indent: 0;}
.BList li {margin-bottom:5px;}
#Contact {height:300px; padding-top:40px; vertical-align:middle; display:none; width: 800px;}
#Contact .sectionContent { margin: 10px 0 0 0;}
.ContactFormLine {clear: both; margin: 0 auto 0 auto; width:700px; height:30px; font-size:110%;}
.ContactFormLeft {float:left; width: 160px; text-align:left; margin:0 0 0 100px;}
.ContactFormRight {float:right; width: 440px; text-align:left;}
.ContactFormRight input {border: 1px solid silver;}
#Name, #Company, #EmailAddress, #TelephoneNumber {width:400px;}
#Enquiry {width:400px; height:100px; vertical-align:top; font-family: 'News Cycle', sans-serif;}
#SubmitQuery {padding-left:100px; width:600px; font-size:140%; margin-top:5px;}
#SubmitQueryImage {float:left; padding-left:250px;}
#SubmitQueryButton {float:left; margin-left:15px; line-height:40px;}
#SubmitQueryButton a {padding: 2px 6px 2px 6px; cursor: pointer;}
#ContactFormError {padding-left:200px; margin-top:80px;}
.NotOptional {color:Red;}

#Contact h2 {font-size:175%; text-align:center;}

#MenuBar {clear:both; margin: 0 auto 0 auto; height:90px; width: 800px; overflow: hidden;}
#MiniLogo {float:left; width:400px; line-height:90px;}
#MiniLogo h1 #hailstone {color:Silver;}
#MiniLogo h1 #software {color:Gray; font-style:italic; padding-right:2px;}
#Menu {float:right; width:400px; background: url(Images/MenuHighlight.jpg) no-repeat 112px 3px;}
#Menu ul {opacity:1; background-color:transparent; list-style: none; margin-left:50px}
#Menu ul li {float: left; font-size: 150%; width:75px; text-align:center; cursor:pointer;}
#HomeButton, #AboutButton, #ContactButton {margin: 0 auto 0 auto; text-align:center;}
#HomeImageContainer {height:44px; width:35px; background:url(../Images/HomeOver.png) no-repeat; margin-left:32px;}
#AboutImageContainer {height:44px; width:35px; background:url(../Images/AboutUsOver.png) no-repeat; margin-left:32px;}
#ODSImageContainer {height:44px; width:35px; background:url(../Images/ODSOver.png) no-repeat; margin-left:32px;}
#ContactImageContainer {height:44px; width:35px; background:url(../Images/ContactUsOver.png) no-repeat; margin-left:32px;}
.button {opacity:0; padding-top:100px; width:100px; text-align:center;}

.Divider {background-color:#c0c0c0; height:1px; margin-bottom:10px;}
#Footer {width: 800px; margin: 0 auto 0 auto; vertical-align:middle; padding-top: 0px;}
#Copyright p {text-align:center; font-size:80%; color:Gray;}


#jquery-msg-bg {
  -moz-opacity: 0.6;
  -khtml-opacity: 0.6;
  opacity: 0.6;
  filter: alpha(opacity=60);
  background: black;
}

.jquery-msg-content {
  -webkit-background-clip: padding-box;
  padding: 15px;
}

.black-on-white .jquery-msg-content {
  background: white;
  color: #333333;
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
  filter: alpha(opacity=90);
  -webkit-box-shadow: 5px 5px 30px 0 black;
  -moz-box-shadow: 5px 5px 30px 0 black;
  box-shadow: 5px 5px 30px 0 black;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -khtml-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  /* ie fix */
  -pie-lazy-init: true;
  behavior: url(PIE.htc);
}

.white-on-black .jquery-msg-content {
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;
  filter: alpha(opacity=50);
  background: black;
  color: white;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -khtml-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  /* ie fix */
  -pie-lazy-init: true;
  behavior: url(PIE.htc);
}
