.box {

padding: 10px;
border: 1px solid #888;
box-shadow: 2px 2px 4px #dedede;
width: 100px;
height: 80px;
background-color: #f5f5f5;
font-family: Arial;
font-size: 12px;
hyphens: auto;
float: left;
font-size: 12px;

}

.box:hover {

background-color: #f0f0f0;

}

userMap {

overflow-x: auto;
overflow-y: auto;
padding: 20px;
min-width: 770px;

}

userMap .active {

background-color: #d6f5d6;
border:1px solid #555;
font-weight: bold;

}

h2.userMapTitle {

font-family: Arial;

}

userMap a:hover {

  text-decoration: none;
}

div.arrow {

max-width: 50px;
margin-left: 15px;
margin-right: 15px;
font-size: 20px;

}

div.content {

max-width: 110px

}

userMap div.arrow, userMap div.content {

float: left;

}

.clearfix {

clear: both;

}

userMap div.arrow {

position: relative;
top: 30px;

}

.box1 {

margin-left:0px;

}

button.btn.btn-default.btn-lg.modalButton1 {

margin-left: -20px;

}

div.box.box1 {

margin-left: -20px;

}

userMap .btn-lg {

width: 100px;
height: 80px;

}

userMap .complexArrow {

font-size: 22px;
margin: 0px 10px;

}

userMap .btn-lg .active {

background-color: #d6f5d6;

}

userMap .btn-lg {

    white-space: pre-wrap;       /* css-3 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
    font-size: 14px;
}