/* Position of draggable elements on the first page*/

#container1_drag_00 {
	left: 10px;
	top: 0px;
}

#container1_drag_01 {
	left: 125px;
	top: 0px;
}

#container1_drag_02 {
	left: 260px;
	top: 0px;
}

#container1_drag_03 {
	left: 390px;
	top: 0px;
}

#container1_drag_04 {
	left: 530px;
	top: 0px;
}

#container1_drag_05 {
	left: 657px;
	top: 0px;
}

#container1_drag_06 {
	left: 750px;
	top: 0px;
}

/* Position of drop boxes on the first page*/

#container1_drop_00 {
	width: 100px;
    height: 100px;
	top: 88px;
    left: 60px;
    background-image:url('../images/circle0.png');
	background-repeat: no-repeat;
}

#container1_drop_00 span {
	top: 19%;
    height: 36px;
    left: -24px;
}


#container1_drop_01 {
	width: 100px;
    height: 100px;
	top: 25px;
	left: 163px;
    background-image:url('../images/circle1.png');
	background-repeat: no-repeat;
}

#container1_drop_01 span {
	top: 25%;
    height: 36px;
    left: -17px;
}


#container1_drop_02 {
	width: 100px;
    height: 100px;
	top: -8px;
	left: 277px;
    background-image:url('../images/circle2.png');
	background-repeat: no-repeat;
}

#container1_drop_02 span {
	top: 34%;
    height: 36px;
    left: -8px;
}


#container1_drop_03 {
	width: 100px;
    height: 100px;
	top: 11px;
	left: 412px;
    background-image:url('../images/circle3.png');
	background-repeat: no-repeat;
}

#container1_drop_03 span {
	top: 32%;
    height: 36px;
    left: -9px;
}


#container1_drop_04 {
	width: 100px;
    height: 100px;
	top: 73px;
	left: 532px;
    background-image:url('../images/circle4.png');
	background-repeat: no-repeat;
}

#container1_drop_04 span {
	top: 27%;
    height: 36px;
    left: -14px;
}


#container1_drop_05 {
	width: 100px;
    height: 100px;
	top: 67px;
	left: 653px;
    background-image:url('../images/circle5.png');
	background-repeat: no-repeat;
}

#container1_drop_05 span {
	top: 20%;
    height: 36px;
    left: -24px;
}



#container1_drop_06 {
	width: 100px;
    height: 100px;
	top: 190px;
	left: 588px;
    background-image:url('../images/circle6.png');
	background-repeat: no-repeat;
}

#container1_drop_06 span {
	top: 19%;
    height: 36px;
    left: -24px;
}


/* Main CSS */

html, body{
  height:100%;
}

body {
	margin: 0;
	padding:0;
	background-color: #FFFFFF;
	font-family: sans-serif;
	font-size: 14px;
}

.group:after { /* aka clearfix*/
    content:" ";
    display:block;
    clear:both;
}

#appWrapper {
	width: 100%;
	max-width: 898px;
	height: 100%;
	max-height: 498px;
	border: 1px solid #666666;
	padding: 10px;
	background-image:url('../images/background.png');
	background-repeat: no-repeat;
    font-family: Gill Sans, Gill Sans MT, Myriad Pro, DejaVu Sans Condensed, Helvetica, Arial," sans-serif";
}

.appNav {
	width: 100%;
	background-color: #FFFFFF;
}

.actions {
	width: 878px;
	position: absolute;
	top: 450px;
}

.actions button {
	width: 130px;
}

.rightCol {
	float: right;
}

.btn-default {
  color: #006b8a;
  background-color: #fdfdfd;
  border-color: #bababa;
}

.btn-default:focus, .btn-default.focus {
  color: #006b8a;
  background-color: #e3e3e3;
  border-color: #7a7a7a;
}

.btn-default:hover {
  color: #006b8a;
  background-color: #e3e3e3;
  border-color: #9b9b9b;
}

.btn-default:active, .btn-default.active,
.open > .btn-default.dropdown-toggle {
  color: #006b8a;
  background-color: #e3e3e3;
  border-color: #9b9b9b;
}

.btn-default:active:hover, .btn-default:active:focus, .btn-default:active.focus, .btn-default.active:hover, .btn-default.active:focus, .btn-default.active.focus,
.open > .btn-default.dropdown-toggle:hover,
.open > .btn-default.dropdown-toggle:focus,
.open > .btn-default.dropdown-toggle.focus {
  color: #006b8a;
  background-color: #d1d1d1;
  border-color: #7a7a7a;
}

.btn-default:active, .btn-default.active,
.open > .btn-default.dropdown-toggle {
  background-image: none;
}

.btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus, .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus,
fieldset[disabled] .btn-default:hover,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .btn-default.focus {
  background-color: #fdfdfd;
  border-color: #bababa;
}

.btn-primary {
  color: #FFF;
  background-color: #007FA3;
  border-color: #006b8a;
}

.btn-primary:focus, .btn-primary.focus {
  color: #FFF;
  background-color: #005770;
  border-color: #00080a;
}

.btn-primary:hover {
  color: #FFF;
  background-color: #005770;
  border-color: #003b4c;
}

.btn-primary:active, .btn-primary.active,
.open > .btn-primary.dropdown-toggle {
  color: #FFF;
  background-color: #005770;
  border-color: #003b4c;
}

.btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus,
.open > .btn-primary.dropdown-toggle:hover,
.open > .btn-primary.dropdown-toggle:focus,
.open > .btn-primary.dropdown-toggle.focus {
  color: #FFF;
  background-color: #003b4c;
  border-color: #00080a;
}

.btn-primary:active, .btn-primary.active,
.open > .btn-primary.dropdown-toggle {
  background-image: none;
}

.btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #007FA3;
  border-color: #006b8a;
}

#instructions {
	position: absolute;
    top: 290px;
    left: 150px;
    width: 420px;
}