﻿@font-face {
    font-family: clockFont;
    src: url(clock_font.ttf);
    /* Font courtesy of http://www.dafont.com/alarm-clock.font */
}
root { 
   display: block;
}

body {
    background: radial-gradient(grey, white) fixed;
    font-family:  sans-serif;
    font-size: large;
    /* IE workaround for centering bodyContainer */
    text-align: center;
}

/* **************** */
.pageContainer, .bodyContainer {
   width: 800px;
   margin:0 auto;
   border: 1px solid;
   background-color: white;
   box-shadow: 7px 7px 5px #ccc;

   /* IE workaround */
   text-align: center;
}

.tableDisplay {
border: 1px solid;
border-collapse: collapse;

}

.tableDisplay td
{
      border: 1px solid;
         padding: 5px;  
   
}

.centeredBlock
{
   margin:0 auto;
   
}

.largeFont, .largeRedFont {
   font-size:x-large;
}

.largeRedFont {
 color:red;
}

input#inputValue
{
   width:250px;
   
}
.clockBorder {
    border-width: 10px;
    border-color: #CCCCCC;
    border-style: ridge;
    padding: 5px;
    margin: 3px;
    width: 220px;
    margin: 0 auto;
    background-color: black;
}

.clockFont {
    font-size: 40px;
    color: #00FF00;
    font-family: clockFont, Helvetica, sans-serif;
}

   /* spinner ***************************** */
   #iframe
   {
      width:100%;
      height:100%;
      border-width: 0;
   }
   
   #spinner{
      width:30px;
   }
   
   #next:active, #previous:active, .active
   {
      background-color: #B8EDC0;
   }
   
   #spinnerConsole
   {
      background-color: #dddddd;
      border:1px solid black;
      border-radius: 25px;
      width: 800px;
      font-size:12px;
      padding:10px;
      margin: 4px auto;
      
   }
   
   #frameLink
   {
      text-decoration:none;
      color: black;
   }
   
   #frameLink:hover{
      text-decoration:underline;
   }
   
