
/*  CCS file for  Live timing  web site

background # DAE0D2

new background # 99CCFF


*/

 


body {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 14px;
   color:  #333333;
   /*background-color:#CCCCFF;*/  
   background:#abb9d1    url("bg2018.gif") repeat-x bottom;
   }

 h1 {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 24px;
   font-weight: bold;
   Text-align:center;
   color: rgb(250,0,0);
   }

h2 {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 16px;
   font-weight: bold;
   Text-align:center;
   color: #000000;

   }
h3 {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 12px;
   font-weight: bold;
   Text-align:center;
   color: #000000;

   }
h4 {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 10px;
   font-weight: bold;
   Text-align:center;
   color: #000000;

   }

#HeadingArea {
   position: absolute;
   width: 100%;
   height:12em;
   left:0;
   top:0;
   border-bottom: none;
   font-weight: normal;
   color: #333333;
   background-color:#CCCCFF;
}
#MainBody {
   width: 100%;
   height:80%;
   top: 20%;
   left: 85%;
   font-weight: normal;
   background-color: #CCCCFF;
   color:#333333;
 }
 #SearchBox {
   position:absolute;

   width: 98%;
   height:2em;
   left:1%;
   top :8em;

   background-color:#CCCCFF;
   border:0;
   border-color:#757575;
   border-style:outset;

   padding-top:2px;
   padding-left:2px;
 }
#SelectorArea {
   position: absolute;
   width: 98%;
   height: 2em;
   top:10em;
   left:1%;
   padding-top:3px;

   /*background-color:#FFFFB2;*/
   font-weight: normal;
   color: #333333;
   border:none;

   border-color:#333333;


   /*background-color:#CCCCFF;*/
}

/*
#############################################################
definitions  for year tabs 
*/

.tabs {
      float:left;
      width:100%;
      /*background-color:#CCCCFF;*/
      background:#abb9d1    url("bg2018.gif") repeat-x bottom;
      font-size:93%;
      line-height:normal;
      border-style:none;
      }
   .tabs ul {
      margin:0;
      padding:10px 10px 0;
      list-style:none;
      border-style:none;
      }
    .tabs li {
      float:left;
      background:url("norm_right.gif") no-repeat right top;
      margin:0;
      padding:0;  
      text-decoration: none;
      
      }
    .tabs a {
      display:block;
      background:url("norm_left.gif") no-repeat left top;
      padding:5px 15px 4px;
      text-decoration:none;
      }
      
    .tabs a:visited{
      text-decoration:none;
      color: #333333;
      }
      
   .tabs a:hover{
    color: #666666;
    
    }
    
    .tabs .current {
    	float:left;
 		background:url("norm_right_on.gif") no-repeat left top;
 		margin:0;
      	padding:0;  
      	text-decoration: none;
     
      }
      
      
    .tabs .current a {
    	display:block;
    	background:url("norm_left_on.gif") no-repeat left top;
      	 padding:5px 15px 4px;
      	margin:0;
       
      }
      
	.tabs .selected a{
		font-weight:bold;
		}
	.content {
		border: 1px solid;
		clear: both;
	}

/*
#######################################################################
*/
#YearSelector{
  position: absolute;
  left:1%;
  top:1px;
  width: 10%;
  background-color:#E0E0E0;
}
#VenueSelector{
  position: absolute;
  left:12%;
  top:1px;
  width: 10%;
  background-color:#E0E0E0;
}
#EventSelector{
  position: absolute;
  left:25%;
  top:1px;
  width: 15%;
  background-color:#E0E0E0;
}
#GroupSelector{
  position: absolute;
  left:42%;
  top:1px;
  width: 25%;
  background-color:#E0E0E0;
}
#CompSelector{
  position: absolute;
  left:80%;
  top:1px;
  width: 15%;
  background-color:#E0E0E0;
}


#ZippButton {
   position: absolute;
   left: 5%;
   width: 15%;
   top:23em;

   height:2em;

}
#AllSearchButton {
   position: absolute;
   left: 35%;
   width: 15%;
   top: 23em;
   height:2em;
}
#VehicleSearchButton {
   position: absolute;
   left: 65%;
   width: 15%;
   top: 23em;
   height:2em;
}
#Footer{
   position: absolute;
   left: 25%;
   width: 50%;
   bottom: 4px;
   height: 2em;
   text-align: center;
}
#BackButton {
   position: absolute;
   width:   10%;
   height:  2em;
   left:  85%;
   bottom: 4px
}

#CurrentEventArea {
   position: absolute;
   width: 60%;
   height: 80%;
   top:12em;
   left:20%;
   font-weight: normal;
   color: #333333;
   background-color: rgb(58,110,165); 
   padding-top:25px;
   padding-bottom:25px;
   padding-right:10px;
   padding-left:10px;

}

#CompetitorGeneralInfo{
	position: absolute;
	width: 68%;
   	min-height:80%;
   	height:80%;
   	top:5em;
   	left:30.5%;
   	overflow:auto;
   	margin: 0;
   	margin-top: 10px;
   	margin-left: 0;
    margin-right:0;

   
   
   border-radius:7px;
	/*-moz-border-radius:25px;  Firefox 3.6 and earlier */
   
 
   border-bottom:3px inset;
   border-top:3px inset;
   border-left:3px inset;
   border-right:3px inset;
   border-color:  #ccc; 
   font-weight: bold;
   color: #333333;
   background-color: #BADBF2;     /*background-color:#EEFFCC;*/
   text-align: center;
}
#CompetitorRunInfo {
   position: absolute;
   width: 98%;
   top: 24.5em;
   left:1%;
   min-height: 20em;
   height:20em;
   margin: 0;
   margin-top: 10px;
   margin-left: 0;
   margin-right:0;
   border-style:solid;
   border-bottom:2px;
   border-top:0;
   border-left:1px;
   border-right:1px;
   font-weight: normal;
   color: #333333;
    background-color: #BADBF2;  /*background-color:#EEFFCC;*/
   text-align: center;
}
 #GroupInfoArea {
   position: absolute;
   width: 98%;
   height:30em;
   top:13em;
   left:1%;
   overflow:scroll;
   margin: 0;
   margin-top: 10px;
   margin-left: 0;
   margin-right:0;
   border-style:inset;
   border-bottom:2px;
   border-top:0;
   border-left:1px;
   border-right:1px;
   font-weight: normal;
   color: #333333;
   background-color: #BADBF2;  /*background-color:#EEFFCf;*/
   text-align: center;
}




/*   table row backgrounds and colour */
.bg1 {
    color: #333333;
    background-color:  #BADBF2;    /*rgb(238,238,238);*/
 }
.bg2 {
   color: #333333;
   background-color: #A6C9E0; /* rgb(205,201,194)*/
}
.bg3 {
   color: #333333;
   background-color: rgb(212,210,204);
}


#navcontainer{
   background-color: rgb(212,210,204);
   }


#navlist
  {
    padding: 1px;
    margin-left: 0;
    margin-top:0;
    margin-bottom:0;
    font: bold 12px Verdana, sans-serif;
    border: 2px solid;
    border-color: #AAA #666 #666 #AAA;
    /*background:url(btn_grey_bkg.png) no-repeat top left;*/
    background-color: #CCC;
    width: 18em;
	 
}


ul.navlist li
           {
           list-style: none;
           /*margin: 0;*/
           padding: 0.25em 1em;
           border: 1px solid;
           border-color: #FFF #AAA #AAA #FFF;
           /*background:url(btn_grey_bkg.png) no-repeat top left;*/
		   margin:5px;
           background-color: #ccc; 
           text-align: center;
		   color:red !important
          }

ul.navlist li a { 
	text-decoration: none;
 	/*background:url(btn_grey_bkg.png) no-repeat bottom right;*/
 }
ul.navlist li a:link { color:  black; } 
ul.navlist li a:visited { color: black; }
ul.navlist li a:hover{background-color:#647396; 
 	border-color: #FE3;
 	color: #FFF;
 	background: #332;
}
ul.navlist li.normalgroup{
	background-color:#ccd;
}
ul.navlist li.teamgroup0{
	background-color:fuchsia;
	color:white;
}
ul.navlist li.teamgroup1{
	background-color:fuchsia;
	color:white;
}
ul.navlist li.teamgroup2{
	background-color:fuchsia;
	color:white;
}
ul.navlist li.teamgroup3{
	background-color:fuchsia;
	color:white;
}
ul.navlist li.subevent0{
	background-color:lightgrey;
	color:red;
}
ul.navlist li.subevent1{
	background-color: beige;
	 
}
ul.navlist li.subevent2{
	background-color:wheat;
}
ul.navlist li.subevent3{
	background-color:lightskyblue;
}
ul.navlist li teamlistitem{
	background-color:skyblue;
	color:white;
	margin-left:5%;	
	margin-right:5%;
}



/*  horizontal  toolbar type list*/

ul.toolbar
          {
          padding: 1px;
          margin-left: 0;
          font: bold 12px Verdana, sans-serif;
          border: 2px solid;
          border-color: #AAA #666 #666 #AAA;
          background-color: #CCC;
          }
ul.toolbar li
           {
            display:inline;
            list-style-type:none;
            padding: 0.25em 1em;
            padding-right: 20px;
            list-style: none;
            margin: 0;
            border: 1px solid;
            border-color: #FFF #AAA #AAA #FFF;
            background-color:#ccc;
            text-align: center;
           }
ul.toolbar li a { text-decoration: none; }
ul.toolbar li a:link { color: black; }
ul.toolbar li a:visited { color: black; }
ul.toolbar li a:hover
{
 border-color: #FE3;
 color: #FFF;
 background: #332;
}
/* Explorer  form stuff   */

#LeftHandPane
          {
          position: absolute;
          width:25%;
          min-height:80%;
          height:80%;
          top:7em;
          left:0.5%;
          overflow:auto;
          margin: 0;
          margin-top: 10px;
          margin-left: 0;
          margin-right:0;
 	border-bottom:3px inset;
   	border-top:3px inset;
   	border-left:3px inset;
   	border-right:3px inset;
   	border-color:  #ccc; 
   	border-radius:7px;
   	font-weight: normal;
   	color: #333333;
   	background-color: #BADBF2;
          text-align: left;
 } 


#GroupTree
          {
          position: absolute;
          width: 29%;
          min-height:80%;
          height:80%;
          top:5em;
          left:0.5%;
          overflow:auto;
          margin: 0;
          margin-top: 10px;
          margin-left: 0;
          margin-right:0;
          font-weight: normal;
          color: #333333;
          /*background-color:#EEFFCf;*/
          text-align: left;
 }
 #RunListHeading
         {
         width: 100%;
          /*position: absolute; */
          
          min-height:2em; 
          height:2em; 
          top:0;
          left:0%;
          /*overflow:auto; */
          margin: 0;
          margin-top: 0;
          margin-left: 0;
          margin-right:0;
          padding-top:0;
          font-weight: normal;
          color: #333333;
          /*background-color:#CCCCFF;*/
          text-align: left;
 }
 #RunListBody
          {
          width: 100%;
          clear:both;
          /* position: absolute; */
          
           min-height:93%;  
          height:40%;   
 
          /*top:4%; */
          left:0%;
          overflow:auto;
          margin: 0;
          margin-top:10px;
          margin-left: 0;
          margin-right:0;
          font-weight: normal;
          color: #333333;
          background-color:#EEFFCf;
          text-align: left;
 }
 /*    Group list  divs     */
#RightHandPane
          {
    position: absolute;
    width: 73%;
    min-height:80%;
    height:80%;
    top:7em;
    left:26%;
    /*overflow:auto;*/
    margin: 0;
    margin-top: 10px;
    margin-left: 0;
    margin-right:0;
    padding-top:0;
    border-bottom:3px inset;
   	border-top:3px inset;
   	border-left:3px inset;
   	border-right:3px inset;
   	border-color:  #ccc; 
   	border-radius:7px;
   	font-weight: normal;
   	color: #333333;
   	background-color: #BADBF2;
          text-align: left;
 } 
#GroupListHeading
         {
          position: absolute;
          min-width: 99%;
          min-height:10%;
          /* height:4em;*/  
          top:2.5em;
           
          
          overflow:hidden;
          margin: 0;
          margin-top: 10px;
          margin-left: 0;
          margin-right:0;
          font-weight: normal;
          color: #333333;
         /* background-color:#EEFFc0;*/
          text-align: left;
           border-radius:7px;
	 
   
 
   border-bottom:0px inset;
   border-top:0px inset;
   border-left:0px inset;
   border-right:0px inset;
   border-color:  #ccc; 
   font-weight: bold;
   color: #333333;
   background-color: #BADBF2;
          
          
 }
#GroupListBody
          {
          position:absolute; 
          min-width: 99%;
          
          min-height:88%;
          /* height:75%; 
          height: -moz-calc(80% -11em);*/
          top:7.5em;
          overflow:auto;
          margin: 0;
          margin-top: 10px;
          margin-left: 0;
          margin-right:0;
        /*border-radius:7px;
		border-bottom:3px inset;
   		border-top:3px inset;
   		border-left:3px inset;
   		border-right:3px inset;
   		border-color:  #ccc; 
        */  
          font-weight: normal;
          color: #333333;
         /*  background-color:#EEFFCf;*/
          text-align: left;
 }

  .arrow-right {
        width: 0;
        height: 0;
        border-top: 60px solid transparent;
        border-bottom: 60px solid transparent;

        border-left: 60px solid green;
       }

#FullWidthPane
          {
          
	 
	  position: absolute;
          width: 95%;
          min-height:90%;
          height:90%;
          top:3em;
          left:2%;
          overflow:auto;
          margin: 0;
          margin-top: 10px;
          margin-left: 0;
          margin-right:0;
          padding-top:0;
 	border-bottom:3px inset;
   	border-top:3px inset;
   	border-left:3px inset;
   	border-right:3px inset;
   	border-color:  #ccc; 
   	border-radius:7px;
   	font-weight: normal;
   	color: #333333;
   	background-color: #DAE0D2;
          text-align: left;
 } 


 
.indexrandomimage {
    float: left;
    border: 1px dotted black;
    margin: 30px 20px 15px 20px;
    width: 320px;
    height: 180px;
    box-shadow: 10px 10px 5px #888888 ;
}
//  style to make a clickable button
a.btn {                        
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
}

/* ====================================================================
   display pane
  */
  
  #LiveDisplay
    {
    position: absolute;
    width: 73%;
    min-height:2em;
    height:3em;
    top:3em;
    left:26%;
    /*overflow:auto;*/
    margin: 0;
    margin-top: 10px;
    margin-left: 0;
    margin-right:0;
    padding-top:0;
    border-bottom:3px inset;
   	border-top:3px inset;
   	border-left:3px inset;
   	border-right:3px inset;
   	border-color:  #ccc; 
   	border-radius:7px;
   	font-weight: normal;
   	color: #333333;
   	background-color:  #A6C9E0; 
    text-align: left;
 }  