/* CSS Document */
body{
margin:0; padding:0;
font-family: Verdana, sans-serif;
color: white;
}

.container{
/*width: 1000px;*/
width: 1006px;
margin: 0 auto;
padding: 0px;
}

.trend{
width:160px;
margin: 0 auto;
position: relative;
top: 20px;
}

/* Header ---------------------------------------- */
#header{
background-image: url('images/header.jpg');
background-repeat:repeat-x;
background-color: #0B5E7E;
height: 99px;
}

#header ul{
margin: 0; 
padding:50px 0 0 0;
}

#header ul li{
display: inline;
margin:0 30px;
}

#header ul a{
color: white;
font-size: 16px;
text-decoration:none;
font-weight: bold;
padding-bottom: 3px;
border-bottom: 2px solid #F4EA76;
}

#header ul a:hover, #header ul a:active{
color: #F4EA76;
}

/* Main --------------------------  */
#main{
background-color: #0E708E;
height: 740px;
}

#title{
margin: 0 auto;
padding-top: 40px;
text-align: center;
}

h1{
font-size: 18px;
font-weight: bold;
display: inline;
}

b{
color: #F4EA76;
}

#subtitle{
font-size: 14px;
font-weight: bold;
width: 800px;
margin: 0 auto;
padding-top: 30px;
text-align: center;
}
/* Content------------------- */

#content{
/*background-color: grey;*/
position:relative;
}

#content_text{
color: white;
font-size: 13px;
font-weight: bold;
font-family: Verdana, sans-serif;
width: 870px;
margin: 0 auto;
line-height: 18px;
}

#retr_up, #retr_down{
width: 260px;
height: 200px;
float:left;
margin: 0 10px;
margin-left: 40px;
position: relative;
color: white;
font-size: 14px;
font-weight: bold;
font-family: Verdana, sans-serif;
}

#enter_up, #enter_down{
width: 300px;
height: 140px;
border: 1px solid #EDF216;
float:left;
margin: 0 10px;
margin-top: 28px;
color: white;
font-size: 14px;
font-weight: bold;
font-family: Verdana, sans-serif;
position: relative;
line-height: 40px;
}

#ext_up, #ext_down{
width: 300px;
height: 200px;
float:left;
margin: 0 10px;
position: relative;
color: white;
font-size: 14px;
font-weight: bold;
font-family: Verdana, sans-serif;
}

input{
margin: 5px;
}

#separator{
width: 900px;
height: 2px;
border: 1px solid #1B9AAF;
padding: 0; margin: 0 auto;
}

.field{
width: 130px;
border: 2px solid #EDF216;
height: 22px;
background-color: white;
color: #0E708E;
font-weight: bold;
}

.button{
background-color: #CCC31D;
border: 2px solid #B5A61C;
color: white;
font-size: 14px;
font-weight: bold;
text-align: center;
width: 135px;
font-family: Verdana, sans-serif;
}

.txt_error{
color: #F9ED32;
font-weight:bold;
font-size: 13px;
width: 500px;
line-height: 20px;
}

#up, #down{
position:relative;
}


#txt_high_up, #txt_low_up, #high_up, #low_up, #calculate_up, #clear_up,
#txt_retr_up, #retr_up_1, #retr_up_2, #retr_up_3, #field_retr_up_1, #field_retr_up_2, #field_retr_up_3,
#txt_ext_up, #ext_up_1, #ext_up_2, #ext_up_3, #ext_up_4, #field_ext_up_1, #field_ext_up_2, #field_ext_up_3, #field_ext_up_4,
#txt_high_down, #txt_low_down, #high_down, #low_down, #calculate_down, #clear_down,
#txt_retr_down, #retr_down_1, #retr_down_2, #retr_down_3, #field_retr_down_1, #field_retr_down_2, #field_retr_down_3,
#txt_ext_down, #ext_down_1, #ext_down_2, #ext_down_3, #ext_down_4, #field_ext_down_1, #field_ext_down_2, #field_ext_down_3, #field_ext_down_4,
#txt_excla_up, #txt_excla_down, #txt_excla_num_up, #txt_excla_num_down{
position: absolute;
}

/* enter-up stuff-------------------------*/
#txt_high_up, #high_up, #txt_high_down, #high_down{
top: 14px;
}

#txt_low_up, #low_up, #txt_low_down, #low_down{
top: 54px;
}

#calculate_up, #clear_up, #calculate_down, #clear_down{
top: 100px;
}

#txt_excla_up{
top: 68px;
}

#txt_excla_down{
top: 340px;
}

#txt_excla_num_up{
top: 80px;
}

#txt_excla_num_down{
top: 352px;
}

#txt_high_up, #txt_low_up, #txt_high_down, #txt_low_down{
left: 30px;
}

#high_up, #low_up, #high_down, #low_down{
left: 90px;
}

#calculate_up, #calculate_down{
left: 6px;
}

#clear_up, #clear_down{
left: 148px;
}

#txt_excla_up, #txt_excla_down, #txt_excla_num_up, #txt_excla_num_down{
left: 290px;
}

/* retr_up stuff ----------------------------- */
#txt_retr_up, #txt_retr_down{
left: 113px;
top: 5px;
}

#retr_up_1, #retr_up_2, #retr_up_3, #retr_down_1, #retr_down_2, #retr_down_3{
left: 30px;
}

#field_retr_up_1, #field_retr_up_2, #field_retr_up_3, #field_retr_down_1, #field_retr_down_2, #field_retr_down_3{
left: 110px;
}

#retr_up_1, #field_retr_up_1, #retr_down_1, #field_retr_down_1{
top: 30px;
}

#retr_up_2, #field_retr_up_2, #retr_down_2, #field_retr_down_2{
top: 70px;
}

#retr_up_3, #field_retr_up_3, #retr_down_3, #field_retr_down_3{
top: 110px;
}

/*  ext_up stuff --------------------------- */
#txt_ext_up, #txt_ext_down{
left: 113px;
top: 5px;
}

#ext_up_1, #ext_up_2, #ext_up_3, #ext_up_4, #ext_down_1, #ext_down_2, #ext_down_3, #ext_down_4{
left: 30px;
}

#field_ext_up_1, #field_ext_up_2, #field_ext_up_3, #field_ext_up_4, #field_ext_down_1, #field_ext_down_2, #field_ext_down_3, #field_ext_down_4{
left: 110px;
}

#ext_up_1, #field_ext_up_1, #ext_down_1, #field_ext_down_1{
top: 30px;
}

#ext_up_2, #field_ext_up_2, #ext_down_2, #field_ext_down_2{
top: 70px;
}

#ext_up_3, #field_ext_up_3, #ext_down_3, #field_ext_down_3{
top: 110px;
}

#ext_up_4, #field_ext_up_4, #ext_down_4, #field_ext_down_4{
top: 150px;
}


/* Footer ------------------------- */
#footer{
background-image: url('images/footer.jpg');
background-repeat:repeat-x;
background-color: #023E44;
}

#footer {
font-size: 14px;
}

#beginning{
width: 270px;
float: left;
padding:15px 0 0 0;
}

#footer ul{
margin: 0; 
padding:15px 0 0 0;
float: left;
}

#footer ul li{
display: inline;
margin:0 0 0 20px;
}

#footer ul li a{
color: white;
font-size: 14px;
text-decoration:none;
font-weight: bold;
padding-bottom: 3px;
}

.clear{
clear:both;
}
#copyright{
color: white;
font-size: 14px;
padding-top: 50px;
}

#footer a{
color: white;
font-size: 13px;
text-decoration:none;
}

#bonuses{
margin-top: 6px;
font-size: 14px;
}

#bonuses a{
text-decoration: underline;
color: white;
}