/**										selery.css
 * a selery class for offering either a menu made up of of <li>s 
 * or buttons which click round a selectiong of 1-4 values 
 * main color: 5599cc mimics the blue of a slected <select> option
 */

fieldset.selery { 
    border-width:2px 0 0 0;
    background-color:#444444;
	}

.selery ul {
    margin:0;
    border:0;
    padding:1px 1px 0 1px;
    list-style:none;
    width:100%;
	float:left;
	}

.selery ul + ul {
    border:0;
    margin:0;
    padding:0;
	}

.selery li {
    border:0;
    padding:0 4px 0 0;
    margin-bottom:2px;
	border-top:1px solid #765;
    color:#765;
	text-align:left;
    width:auto;
	background-image:url("../images/gradient_vertical.png");
    background-repeat:repeat-x;
    background-color:#ccc;
	}

.selery li input {
    display:none;
    margin:2px;
    border:0;
    padding:1px;
	float:left;
    width:1em;
    height:auto;
	}

.selery li:hover, .selery li.checked  {  
    border-color:#5599cc;
    background-color:#5599cc;
    color:#ffffff;
	cursor:pointer;
	}

.selery li p { 
    margin:2px 5px;
    border:0;
    padding:0;
	font-size:small; 
    font-weight:600;
	}

/*these are for the grow selery button*/
button.selery { 
	width:16px; height:16px; border-style:none;	
	background-repeat:no-repeat;
	}
button.selery img { 
    float:left;
	width:12px; height:12px;
	background-repeat:no-repeat;	
    padding:1px;border:0;
	}
button.selery[value="1"] img { 
	background-image:url("../images/dot1.png");
	}
button.selery[value="2"] img { 
	background-image:url("../images/dot2.png");
	}
button.selery[value="3"] img { 
	background-image:url("../images/dot3.png");
	}
button.selery[value="4"] img { 
	background-image:url("../images/dot4.png");
	}