.dropContainer {
    border: 2px dotted #A3A3A3;
    padding: 10px;
    border-radius: 4px;
    background-color: #ffffff;
    text-align: center;
    cursor: pointer;
    color: #A3A3A3;
}

.dropContainer.success {
    border-color: #3E753F;
    color: #3E753F;
}

.dropContainer .dropzoneDetails {
    margin-top: 10px;
    width: 100%;
}

.dropContainer .dropzone.dragging {
    border: 2px solid blue;
}

.dropContainer .preview {
    display: inline-block;
    width: 100%;
    max-width: 200px;
}


#formControls {
    position: fixed;
    bottom: 0;
    left:0;
    width: 100%;
    background-color: #F8F8F8;
    border-top: #E7E7E7 1px solid;
    padding: 10px;
    z-index: 100;
}

label small {
    color: #777777;
    font-weight: normal;
}

/* inspired by bootstrap .well */
.formSection, .formSectionClear {
    background-color: #F5F5F5;
    border: solid 1px #E3E3E3;
    padding: 19px;
    min-height: 20px;
    margin-bottom: 20px;
    border-radius: 4px;
}

form .formSectionClear {
    background-color: transparent;
}

form .formSection hr {
    /* darken from bootstrap defaults so it works on the gray background */
    border-top: 1px solid #CCC;
}


/* inspired by bootstrap's use of .bs-example */
.formSectionTitle {
    margin-top: 0;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #959595;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#pageNavigation {
    height: 52px;
}

#pageNavigation .fixedNavBar.affix {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 200;
    background-color: #F8F8F8;
    box-sizing: border-box;
    height: 52px;
    /*overflow: hidden;*/
    border-bottom: 1px solid #E7E7E7;
}

#pageNavigation .fixedNavBar {
    position: relative;
    z-index: 200;
}

#pageNavigation .fixedNavBar.affix .navbar {
    margin-bottom: 0;
    border-color: transparent;
    border-bottom: 1px solid #E7E7E7;
    border-radius: 0;

}

.formSectionHeader, a:link.formSectionHeader, a:hover.formSectionHeader, a:visited.formSectionHeader {
    display: block;
    color: inherit;
    text-decoration: none;

    /* this padding may cause some problems clicking in the area directly above these headers */
    /* it's here to fix the problem of having static headers and the scroll position of content */
    /* ref: http://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header */
    padding-top: 52px;
    margin-top: -52px;
}

/*
using bootstrap breadcrumbs in nav turned out to b a bad idea but in case you need to embrace it in the future here is how
.navbar .breadcrumb {
    display: inline-block;
    background-color: transparent;
    line-height: 20px;
    padding: 15px;
    margin: 0;
    border-radius: none;
}
*/

/* overiding bootstrap because they are doing it wrong */
#pageNavigation .navbar-toggle {
    padding: 6px 12px;
}


#bs-example-navbar-collapse-2 {
    z-index: 900;
}

body {
    position: relative;
    margin-bottom: 50px;
}

/* Pretty Multi Select */


.ms-container {
    width: 100%;
    margin: 0px;
}

.ms-container .search-input {
    margin-bottom: 4px;
    width: 100%;
    text-align: center;
}

.ms-container .results_header {
    text-align: center;
    color: #b3b3b3;
    margin: 0 0 4px 0;
    padding: 3px;
}

#moreFiltersToggle .glyphicon {
    Font-size: 80%;
}

#moreFilters {
    display: none;
}

.ms-container .ms-selectable, .ms-container .ms-selection {
    background-color: transparent;
}

.ms-container .ms-list {
    background-color: white;
}

.radioInline label {
    padding-right: 5px;
}