/** CSS styles specific to Pinboard visualization in DH Press
 **/

@charset "UTF-8";

    /* Enable scroll bar in case background image is too large */
#dhp-visual {
    overflow: auto;
}

.hide {
	display: hidden;
}

#svg-container {
    padding-top: 45px;
    padding-left: 4px;
}

svg {
    /* Would be nice to float SVG in center, but this doesn't work */
/*    margin-left: auto;
    margin-right: auto; */
    border: 1px solid #000;
}


/* ==================== NAV BUTTONS ====================*/

    /* image movement & animation control icons */
#dhp-pin-controls {
    height: 48px;
    margin: 3px;
    margin-right: 6px;
    padding: 0;

    border: 1px solid #000;

    float: right;

    -moz-box-shadow: 0 0 5px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,0.3);
    box-shadow: 0 0 5px 5px rgba(0,0,0,0.3);
}
/*
#dhp-pin-controls button {
    background: none;
    border-bottom: none;
}*/

    /* control buttons are Foundation font icons */
#dhp-pin-controls .pin-fndn-icon {
    margin-left: 4px;
    margin-right: 4px;
    font-size: 32px;
    line-height: 32px;
    height: 36px;
}
    /* style for control buttons */
#dhp-pin-controls .pin-fndn-icon button:before {
    color: black;

}
#dhp-pin-controls .pin-fndn-icon button {
    background-color: white !important;
    font-size: 28px;
    padding: 6px 4px 4px;
}
    /*gives user feedback of hovering over control*/
#dhp-pin-controls .pin-fndn-icon button:hover {
    box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.3);
    background-color: transparent !important;
}
#dhp-pin-controls .pin-fndn-icon button:focus {
    background-color: transparent !important;
    outline: 0;
}


/* ==================== LEGENDS ====================*/

.layer-set {
    margin: 6px;
}

#layers-panel a.value {
    line-height: 15px !important;
    overflow: hidden;
    margin-left: 4px;
}