/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.uparrowdiv, .downarrowdiv, .leftarrowdiv, .rightarrowdiv{
	position: absolute;
	display: block;
	background:#aaa;
	color:#fff;
	width:170px;
	height:40px;
	padding:4px 10px 4px 10px;	
	font-family:Arial, Verdana, sans-serif;
	font-size:13px;
	box-shadow: 0px 0px 1px #000;
	-moz-box-shadow: 0px 0px 1px #000;
	-webkit-box-shadow: 0px 0px 1px #000;
	border:1px solid #FFF;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	z-index:5001;
}

.uparrowdiv { 
margin-top:15px;
margin-left:5px;
}
.downarrowdiv { 
margin-top:-50px;
margin-left:15px;
}

.uparrowdiv:after{ /*arrow added to uparrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:-20px; /*should be set to -border-width x 2 */
	left:30px;
	width:0;
	height:0;
	border-color: transparent transparent #aaa transparent; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;

}

.downarrowdiv:after{ /*arrow added to downarrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:100%; /*should be set to 100% */
	left:30px;
	width:0;
	height:0;
	border-color: #aaa transparent transparent transparent; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}

.leftarrowdiv:after{ /*arrow added to leftarrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:10px;
	left:-20px; /*should be set to -border-width x 2 */
	width:0;
	height:0;
	border-color: transparent #aaa transparent transparent; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}

.rightarrowdiv:after{ /*arrow added to rightarrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:10px;
	left:100%; /*should be set to 100% */
	width:0;
	height:0;
	border-color: transparent transparent transparent #aaa; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}