#bones #preload{
    display: none;
}

.accInstructionOn {
    display:none;
}

#sideMenu .draggable {
    background-color: blue;
    opacity: 0;
    width: 1012px;
    height:642px;
    position: absolute;
    top: 30px;
    left: 0;
}

#sideMenu #c0.content .section {
    margin-bottom: 24px;
}

#sideMenu #c0.content p, #contentArea #guide p {
    margin-bottom: 12px;
    font-size: 16px;
}

#sideMenu #c0.content h2, #contentArea #guide h2 {
    margin-bottom: 4px;
    font-size: 16px;
    text-transform: uppercase;
}

#sideMenu #c1 {
    overflow: hidden !important;
}

#sideMenu #c1.content {
    padding: 0;
    background: #ccc;
}

#sideMenu #c1 .menu_bone {
    cursor:pointer;
    padding:20px;
    background-color:none;
}

#sideMenu #c1 .menu_bone, #sideMenu #c1 .menu_bone img {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    
    user-drag: none; 
    -webkit-user-drag: none;
}

#sideMenu #c1 .menu_bone.hover {
    background-color: white;
}

#sideMenu #c1 .menu_bone.disabled.hover {
    background-color:rgba(255,255,255,0);
    cursor:default;
}

#sideMenu #c1 .menu_bone .shaker {
    width: 100%;
    height: 100%;
}

#sideMenu #c1 .menu_bone img {
    display: block;
    margin: auto;
    max-width: 100%;
}

#sideMenu ul li {
    list-style-type:inherit;
}

#contentArea {
    background-color: white;
}

#contentArea #articulationWindow {
    width: calc(100% - 306px);
    float: left;
}

#contentArea #title, #guide #title {
    background-color: #ccc;
    width: 100%;
    height: 30px;
    line-height: 30px;
    text-align: center;
}

#sideMenu #c0.content, #contentArea #guide #content {
    padding: 16px;
    line-height: 130%;
    font-weight: 400;
}

#sideMenu #c0.content {
    padding-bottom:0;
}

#sideMenu #c0 #arrowHolder {
    margin-left: -16px;
    top:576px !important;
}

#contentArea #title h1, #contentArea #guide h1 {
    font-size: 17.2px;
    text-transform: uppercase;
    color:white;
    background-color: #444444;
}

#contentArea #articulationWindow .draggable {
    background-color: beige;
    opacity: 0;
    height: 642px;
}

#contentArea #title #name, #contentArea #current, #contentArea #total {
    display: inline-block;
}

#contentArea #text {
    position:relative;
    display: none;
}

#contentArea #bones .content_bone {
    position:absolute;
    padding: 0;
    margin: 0;
}

#contentArea #bones .content_bone img {
    padding: 0;
    margin: 0;
}

#contentArea #bones .content_bone.selected {
    outline: 6px #E85C1C solid;
}

#contentArea #guide {
    float:right;
    width: 300px;
    height: 672px;
    border-left-width: 6px;
    border-left-color: #a3a3a3;
    border-left-style: solid;
    background-color: #ccc;
}

#contentArea #guide #content {
    padding: 0;
}

#contentArea #guide #explanation, #contentArea #guide #instructions li  {
    padding: 16px;
}

#contentArea #guide #explanation {
    padding-bottom: 10px;
    margin-bottom: 24px;
}

#contentArea #guide #explanation {
    background-color: white;
}

#contentArea #guide #instructions {
    margin: 0;
    padding: 0;
}

#contentArea #guide #instructions li {
    opacity:0.25;
    background-color:white;
}

#contentArea #guide #instructions li.active {
    color:black;
    opacity:1;
}

#contentArea #guide #instructions .bone {
    text-transform: uppercase;
}

#contentArea #guide #nextButton {
    position: relative;
	padding: 10px;
	cursor: pointer;
   	border:2px solid #B94800;
    background-color:#E85C1C;
	color: white;
	text-align:center;
    text-transform: uppercase;
    letter-spacing: .6px;
    font-weight:500 !important;
    font-size:20px !important;
    margin: 0 auto;
}

#contentArea #guide #buttonHolder {
    position:relative;
    text-align: center;
}

#contentArea #guide #congratulations {
    background-color: #E85C1C;
    color: white;
    margin-top: 12px;
    padding: 12px;
    
}

#contentArea #guide #congratulations h2, #contentArea #guide #congratulations p {
    text-align: center;
    letter-spacing: .6px;
}

#contentArea #guide #congratulations h2 {
    font-weight:500 !important;
    font-size:20px !important;
}

#contentArea #guide #congratulations p {
    padding-bottom: 0;
    margin-bottom: 0;
}

#contentArea #guide #nextButton.disabled, .menu_bone.disabled {
    cursor:default;
    opacity: 0.25;
}

#contentArea #guide #nextButton.disabled, #contentArea #guide #buttonHolder.disabled, #contentArea #guide #congratulations.disabled {
    display: none;
}

.contentAcc {
    position:absolute;
}

.contentAcc p{
    margin-top: 0px;
}

#nextAcc {
    left:196px;
    top:12px;
}

.corner {
    width: 2px;
    height: 2px;
    visibility: hidden;
    position: absolute;
    background-color: deepskyblue;
}

/* Collider corners */
#atlas .corner.a {left: 150px; top: 10px;}
#atlas .corner.b {left: 185px; top: 10px;}
#atlas .corner.c {left: 185px; top: 20px;}
#atlas .corner.d {left: 150px; top: 20px;}

#axis .corner.a {left: 96px; top: 0px;}
#axis .corner.b {left: 116px; top: 0px;}
#axis .corner.c {left: 116px; top: 20px;}
#axis .corner.d {left: 96px; top: 20px;}

#clavicle .corner.a {left: 85px; top: 16px;}
#clavicle .corner.b {left: 100px; top: 16px;}
#clavicle .corner.c {left: 100px; top: 36px;}
#clavicle .corner.d {left: 85px; top: 36px;}

#coxael .corner.a {left: 44px; top: 34px;}
#coxael .corner.b {left: 58px; top: 75px;}
#coxael .corner.c {left: 52px; top: 106px;}
#coxael .corner.d {left: 28px; top: 72px;}

#coxaer .corner.a {left: 110px; top: 35px;}
#coxaer .corner.b {left: 125px; top: 70px;}
#coxaer .corner.c {left: 110px; top: 106px;}
#coxaer .corner.d {left: 105px; top: 70px;}

#femur .corner.a {left: 80px; top: 0;}
#femur .corner.b {left: 90px; top: 20px;}
#femur .corner.c {left: 80px; top: 38px;}
#femur .corner.d {left: 60px; top: 5px;}

#femur_tibia .corner.a {left: 3px; top: 330px;}
#femur_tibia .corner.b {left: 13px; top: 328px;}
#femur_tibia .corner.c {left: 13px; top: 348px;}
#femur_tibia .corner.d {left: 3px; top: 340px;}

#femur_tibia_fibula .corner.a {left: 18px; top: 310px;}
#femur_tibia_fibula .corner.b {left: 38px; top: 310px;}
#femur_tibia_fibula .corner.c {left: 38px; top: 330px;}
#femur_tibia_fibula .corner.d {left: 18px; top: 330px;}

#fibula .corner.a {left: 0; top: 0;}
#fibula .corner.b {left: 18px; top: 5px;}
#fibula .corner.c {left: 18px; top: 15px;}
#fibula .corner.d {left: 5px; top: 15px;}

#foot .corner.a {left: 32px; top: 7px;}
#foot .corner.b {left: 55px; top: 0;}
#foot .corner.c {left: 68px; top: 10px;}
#foot .corner.d {left: 55px; top: 15px;}

#foot_tibia .corner.a {left: 0; top: 10px;}
#foot_tibia .corner.b {left: 10px; top: 10px;}
#foot_tibia .corner.c {left: 10px; top: 30px;}
#foot_tibia .corner.d {left: 0; top: 20px;}

#hand .corner.a {left: 80px; top: -5px;}
#hand .corner.b {left: 100px; top: -5px;}
#hand .corner.c {left: 100px; top: 5px;}
#hand .corner.d {left: 80px; top: 5px;}

#hand_ulna .corner.a {left: 55px; top: 330px;}
#hand_ulna .corner.b {left: 75px; top: 330px;}
#hand_ulna .corner.c {left: 75px; top: 345px;}
#hand_ulna .corner.d {left: 55px; top: 345px;}

#humerus .corner.a {left: 65px; top: 20px;}
#humerus .corner.b {left: 85px; top: 20px;}
#humerus .corner.c {left: 85px; top: 40px;}
#humerus .corner.d {left: 65px; top: 40px;}

#humerus_radius .corner.a {left: 85px; top: 315px;}
#humerus_radius .corner.b {left: 100px; top: 315px;}
#humerus_radius .corner.c {left: 100px; top: 330px;}
#humerus_radius .corner.d {left: 85px; top: 330px;}

#mandible .corner.a {left: 4px; top: 14px;}
#mandible .corner.b {left: 24px; top: 14px;}
#mandible .corner.c {left: 24px; top: 34px;}
#mandible .corner.d {left: 4px; top: 34px;}

#patella .corner.a {left: 50%; top: 0;}
#patella .corner.b {right: 0; top: 50%;}
#patella .corner.c {left: 50%; bottom: 0;}
#patella .corner.d {left: 0; top: 50%;}

#radius .corner.a {left: 65px; top: 0;}
#radius .corner.b {left: 85px; top: 0;}
#radius .corner.c {left: 85px; top: 20px;}
#radius .corner.d {left: 65px; top: 20px;}

#ribs .corner.a {left: 18px; top: 123px;}
#ribs .corner.b {left: 38px; top: 123px;}
#ribs .corner.c {left: 38px; top: 143px;}
#ribs .corner.d {left: 18px; top: 143px;}

#ribs_scapula .corner.a {left: 105px; top: 112px;}
#ribs_scapula .corner.b {left: 125px; top: 112px;}
#ribs_scapula .corner.c {left: 125px; top: 132px;}
#ribs_scapula .corner.d {left: 105px; top: 132px;}

#sacrum .corner.a {left: 10px; top: 10px;}
#sacrum .corner.b {left: 20px; top: 10px;}
#sacrum .corner.c {left: 20px; top: 50px;}
#sacrum .corner.d {left: 10px; top: 50px;}

#sacrum_coxaer .corner.a {left: 220px; top: 32px;}
#sacrum_coxaer .corner.b {left: 238px; top: 50px;}
#sacrum_coxaer .corner.c {left: 238px; top: 80px;}
#sacrum_coxaer .corner.d {left: 220px; top: 96px;}

#sacrum_coxaer_coxael .corner.a {left: 75px; top: 184px;}
#sacrum_coxaer_coxael .corner.b {left: 85px; top: 184px;}
#sacrum_coxaer_coxael .corner.c {left: 102px; top: 208px;}
#sacrum_coxaer_coxael .corner.d {left: 90px; top: 217px;}

#scapula .corner.a {left: 62px; top: 46px;}
#scapula .corner.b {left: 82px; top: 46px;}
#scapula .corner.c {left: 82px; top: 66px;}
#scapula .corner.d {left: 62px; top: 66px;}

#skull .corner.a {left: 170px; top: 173px;}
#skull .corner.b {left: 190px; top: 173px;}
#skull .corner.c {left: 190px; top: 193px;}
#skull .corner.d {left: 170px; top: 193px;}

#tibia .corner.a {left: 10px; top: 0;}
#tibia .corner.b {left: 30px; top: 0;}
#tibia .corner.c {left: 30px; top: 10px;}
#tibia .corner.d {left: 10px; top: 10px;}

#ulna .corner.a {left: 40px; top: 20px;}
#ulna .corner.b {left: 60px; top: 20px;}
#ulna .corner.c {left: 60px; top: 40px;}
#ulna .corner.d {left: 40px; top: 40px;}