﻿body
{
}
#title
{
    font: 19px B Titr,tahoma;
    padding: 0px 0 2px;
    text-align: center;
    border-bottom:1px solid #bebebe;
    margin-bottom:5px;
}
#fields 
{
	border: 2px solid #c1c1c1;
    border-radius: 2px 2px 2px 2px;
    box-shadow: 0 0 5px 2px #B5B5B5;
    padding: 1px;
    width: 490px;
}
#fields table
{
	border:2px solid #eee;
}
#fields td
{
	font:12px tahoma;
	border:1px solid #efefef;
	border-bottom-color:White;
}
#desc
{
    color: #484848;
    direction: rtl;
    font: 15px tahoma;
    padding: 10px 2px;
    text-align: justify;
}
.TextBox {
    border: 1px solid #B5B5B5;
    direction: ltr;
    font: 12px tahoma;
    margin: 0;
    outline: medium none;
    padding:2px;
}
.TextBox:hover
{
	  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
}
.TextBox:focus
{
    border: 1px solid #4D90FE;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) inset;
}
#shapes
{
	height:350px;
	overflow:hidden;
	text-align:center;
	
}
#result-label
{
    background-color: #2A2A2A;
    display: inline-block;
    height: 40px;
    min-width: 45px;
    padding: 0 10px 0 0;
    text-align: center;
}
#tri
{
    border-color: transparent #2A2A2A;
    border-style: solid;
    border-width: 20px 15px 20px 0;
    display: block;
    height: 0;
    margin-left: -15px;
    position: absolute;
    width: 0;
    font-size: 0;
    line-height: 0;
}
#label
{
    color:White;
	padding-left: 8px;
    font: bold 35px/40px Arial;
	
}
.H
{
    display: inline-block;
    font: bold 12px tahoma !important;
    margin-top: 10px;
}

.item1
{
	margin-bottom:10px;
	border:none;
	text-align:left;
	display:none;
}
.box
{
    background-color: #222222;
    display: inline-block;
    font: 12px/29px Arial;
    height: 30px;
    padding-right: 20px;
    text-align: right;
    width: 50px;
}
.tri
{
    border-color: transparent #FF0000;
    border-style: solid;
    border-width: 15px 0 15px 25px;
    display: inline-block;
    height: 0;
    width: 0;
    font-size: 0;
    line-height: 0;
    position:absolute;
}
#A .box{background-color:#01a050; width:150px;}
#A .tri{border-color: transparent #01a050;}
#B .box{background-color:#4eb548; width:175px;}
#B .tri{border-color: transparent #4eb548;}
#C .box{background-color:#bed52f; width:200px;}
#C .tri{border-color: transparent #bed52f;}
#D .box{background-color:#fcef02; width:225px;}
#D .tri{border-color: transparent #fcef02;}
#E .box{background-color:#fbb611; width:250px;}
#E .tri{border-color: transparent #fbb611;}
#F .box{background-color:#f16e20; width:275px;}
#F .tri{border-color: transparent #f16e20;}
#G .box{background-color:#ec1a23; width:300px;}
#G .tri{border-color: transparent #ec1a23;}
