﻿body
{   <div id='buttons'>
font-family:Tahoma, Geneva, sans-serif;
background-color:#FFFFFF;
}
* { font-family:Arial; }
h2 { padding:0 0 5px 5px; }
h2 a { color: #224f99; }
a { color:#224f99;  }
a:hover { color:#802727; }
p { padding:0 0 5px 0; }


.box
{
margin-left: auto;
margin-right: auto;
background-color: #7AABFF;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding: 0px;
width:300px;
height:left;
position:relative;
clear:both;
display:-webkit-box;
-webkit-box-orient: vertical;
-webkit-box-flex: 1; /*1 flexible 0 fixed*/
}

.rectangle {
 background: #CAC4FF;
 height: 50px;
 width: 360px;
 position: relative;
 left:-30px;
 top: 30px;
 -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
 -khtml-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
 -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
 z-index: 100;
}

.triangle-l {
 border-color: transparent #CAC4FF transparent transparent;
 border-style:solid;
 border-width:20px;
 height:0px;
 width:0px;
 position: relative;
 left: -50px;
 top: 10px;
 z-index: -1; /* displayed under box */
}
.triangle-r {
 border-color: transparent transparent transparent #CAC4FF;
 border-style:solid;
 border-width:20px;
 height:0px;
 width:0px;
 position: relative;
 left: 310px;
 top: -30px;
 z-index: -1; /* displayed under box */
}

.rectangle h2 {
 font-size: 30px;
 color: #222;
 margin-top:5px;
 text-shadow: 0px 2px 3px #555;
 text-align: center;
}

.label {
    width: 120px;
    display:inline-block;
	font-size:20px;
	height: 29px;
	text-align:right;
}

.label2 {
    width: 80px;
    display:inline-block;
	font-size:16px;

}

.textbox {
    width: 100px;
    display:inline-block;

}

.form{
padding: 0px 25px 35px 25px;
}
.form ul{
list-style: none;
padding:0;
margin:2px;
}
.form ul li{
margin:0 0 9px 0;
padding:0;
}
/* Make inputs go to their own line */
.form input{
display:inline;
}
#big_wrapper
{
    max-width: 1000px;
    margin: 20px 0px;
    display:-webkit-box;
    -webkit-box-orient: vertical;
    -webkit-box-flex: 1; /*1 flexible 0 fixed*/
}


#TextBoxesGroup2
{
   float: left;
   width: 120px;
   font:25px Calibri
}
#canvas 
{
 margin: 0 0 0 102px; 
}

#boxinfo
{
margin-left: auto;
margin-right: auto;
width:550px; 
box-shadow: 10px 10px 5px #888888; 
font:16px Calibri;
background-color:#76949F;
padding: 0px 25px 35px 25px;
text-align:center;
position: relative;
}
#about
{
margin-left: auto;
margin-right: auto;
font:16px Calibri;
text-align:center;
}

#carsMain
{
border:1px solid;
border-radius:25px;
background-color:#D8F0FF;
width:850px;
margin-left: auto ;
margin-right: auto ;
}
#rltMain
{
border:1px solid;
border-radius:25px;
background-color:#D8F0FF;
width:600px;
margin-left: auto ;
margin-right: auto ;
}



#StartButton{
text-align:center;
padding: 0px 0px 15px 0px;
}

input#btnStart{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 25px; /*add some padding to the inside of the button*/
background:#35b128; /*the colour of the button*/
border:1px solid #33842a; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
box-shadow: 0 0 4px rgba(0,0,0, .75);
/*style the text*/
color:#f3f3f3;
font-size:1.1em;
}
/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#btnStart:hover, input#btnStart:focus{
background-color :#399630; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
box-shadow: 0 0 1px rgba(0,0,0, .75);
}