body {
	margin: 0;
	padding: 0;
	font-family: "Lucida Sans Unicode","Lucida Grande",Garuda,sans-serif;
}

nav ul {
	margin: 0;
	background-image: -moz-linear-gradient(bottom, rgba(230,230,230,0.4), rgba(230,230,230,1), rgba(230,230,230,0.4)); 
	
	border-bottom: 1px solid #DDD;
	border-bottom: 2px solid #DFDFDF;
}
	nav li {
		float: left;
		margin: 0;
		padding: 0 .5em 0 0;
		display: inline;
	}
	
		nav li a {
			width: auto;
			text-decoration: none;
			color: #222;
			text-shadow: 1px 1px 1px #FFF;
		
			margin-left: .5em;
			padding: .5em .5em;
		
			float: left;
		}
	
	nav li.active {
		background-image: -moz-linear-gradient(bottom, rgba(255,255,255,0), rgba(211,211,211,0.9), rgba(194,194,194,0.9), rgba(211,211,211,0.9), rgba(255,255,255,0)); 
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
		overflow: hidden;
	}
		nav li.active a {
			color: #000;
			text-shadow: 1px 1px 1px rgba(255,255,255,.9);
			padding: .5em 0;
			margin: 0 -5px;
		}
		
	.beforeShadow, .afterShadow {
		float: left;
		height: 30px;
		width: 30px;
        margin-top: 5px;
		background-image: -moz-radial-gradient(center, contain, rgba(150,150,150,1), rgba(255,255,255,0)); 
	}
		.beforeShadow {
			margin-left: -15px;
		}
		.afterShadow {
			margin-right: -26px;
		}

section {
	clear: both;
	padding: 0 0 2em 2em;

	border-bottom: 10px solid #EFEFEF;
	margin: 0 0 1em 0;
	width: 50%;
}

#bocoup_draggable, #bocoup_droppable {
	padding: 1em;
	padding: .5em;
	margin: .5em;
	border: 1px solid #DDD;
	width: 150px;
	background-color: #EFEFEF;
	text-align: center;
}

.ui-state-default {
    cursor: pointer;
}

#feedback { font-size: 1em; }
#selectable .ui-selecting { background: #FECA40; }
#selectable .ui-selected { background: #F39814; color: white; }
#selectable { list-style-type: none; margin: 0; padding: 0; width: 30%; }
#selectable li { margin: 3px; padding: 0.4em; font-size: 0.8em; border: 1px solid #b9b9b9; background-color: #EFEFEF;}

.ui-accordion-header {
    background-color: #EFEFEF;
    border: 1px solid #DDD;
    padding: .25em .5em;
}
    a {
        text-decoration: none;
        color: #6666BB;
    }

.clearfix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0;}
.clearfix{display:inline-block;}
html[xmlns] .clearfix{display:block;}
* html .clearfix{height:1%;}
