html, body {
    margin: 0px;
    height: 100%;
    padding-top: 25px;

    background-color: #222222;
    color: white;
    font-family: Verdana, sans-serif;
    overflow: hidden;
}


@media (max-width: 979px) {
    body {
        padding-top: 0px;
    }
}


.flex-container-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
    align-items: stretch;
}

.flex-item {
    flex: 1 0;
    position: relative;
}

.flex-item-half {
    flex: 1 0 50%;
    max-width: 50%;
}

.flex-item-row {
    flex: 0 1 100%;
}

#map {
    position: relative;
}

.map-z-index {
    z-index: 1;
}

.map-size{
    height: 45vh;
    width: 100%;
}

#controls {
    text-align: center;
    font-size: 120%;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}

.imgwithtext { position: relative }
.imgwithtext img { float: center }
.imgwithtext span {
    text-align: center;
    position: absolute;
    font-weight: bold;
    top: 0px;
    right: 0px;
    left: 0px;
}
.imgwithtext span.shadow {
    top: 1px;
    right: -1px;
    left: 1px;
    color: black;
}

.center { text-align: center }

.right {
    float: right;
    text-align: right;
}
.left {
    float: left;
    text-align: left;
}


.zoomable { cursor: url('/i/magnify.gif'), url('/i/magnify.cur') }



@media print {
    #topheight {
        width: 100%;
        text-align: center;
        float: none;
    }
    #largeimg { width: 87% }
    #map { display: none }
    #controls { display: none }
}
#loading {
    text-align: center;
    vertical-align: center;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.9);
    z-index: 1000;
}
#loading div {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 50%;
    height: 60%;
    margin: auto;
}
.dim {
    position: absolute;
    margin: 0px;
    padding: 0px;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color:rgba(0,0,0,0.9);
}
#copyright {
    width:100%;
    text-align:right;
    font-size:10px;
    color:white;
}

.leaflet-control-geosearch, .leaflet-control-geosearch ul {
    border-radius: 7px;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
    margin: 10px 0 0 0;
    padding: 5px;
    width: 100%;
    height: auto;
}
.leaflet-control-geosearch-msg ul {
    list-style: none;
    display: none;
    height: auto;
    background: none;
    padding: 0;
    color: black;
}
.leaflet-control-geosearch ul li {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.75);
    border-radius: 4px;
    margin: 2px 0;
    padding: 4px;
    font: 12px arial;
    text-indent: 4px;
}
.leaflet-container .leaflet-control-geosearch input {
    width: 100%;
    height: 28px;
    padding: 0;
    text-indent: 8px;
    background: rgba(255, 255, 255, 0.75);
    border-radius: 4px;
    border: none;
    margin-bottom: 0px;
}
.leaflet-center {
    width: 40%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.leaflet-popup-content
{
    color: black;
    min-width: 280px;
}

.leaflet-popup-content-wrapper
{
    min-width: 300px;
}


/*
.leaflet-popup-contentm, .footwayDD
{
    color: black;
    min-width: 580px;
}

.leaflet-popup-content-wrapper, .footwayDD
{
    min-width: 600px;
}*/


.LowQuality {
    color: #f00;
    top:auto !important;
    bottom:0px;
}

#mapSetSelect
{
    margin-top: 6px;
}

#workPackageSelect
{
    margin-top: 6px;
}

#mapTypeSelect
{
    margin-top: 6px;
}

#teamSelect
{
    margin-top: 6px;
}


#smallImageContainer
{
    margin-top: 5px;
}

#topLeftImageThumb
{
    position: relative;
    width: 100%;

    border-style: solid;
    border-width: 1px;
    /*float: left;*/
}

#topLeftImageThumb img
{
    float: center
}

#topLeftImageThumb span
{
    text-align: center;
    position: absolute;
    font-weight: bold;
    top: 0px;
    right: 0px;
    left: 0px;
}

#topLeftImageThumb span.shadow
{
    top: 1px;
    right: -1px;
    left: 1px;
    color: black;
}

#topRightImageThumb
{
    position: relative;
    width: 100%;

    border-style: solid;
    border-width: 1px;
    /*float: right;*/
}

#topRightImageThumb img
{
    float: center
}

#topRightImageThumb span
{
    text-align: center;
    position: absolute;
    font-weight: bold;
    top: 0px;
    right: 0px;
    left: 0px;
}

#topRightImageThumb span.shadow
{
    top: 1px;
    right: -1px;
    left: 1px;
    color: black;
}

#bottomLeftImageThumb
{
    position: relative;
    width: 100%;

    border-style: solid;
    border-width: 1px;
    /*float: left;*/
}

#bottomLeftImageThumb img
{
    float: center
}

#bottomLeftImageThumb span
{
    text-align: center;
    position: absolute;
    font-weight: bold;
    top: 0px;
    right: 0px;
    left: 0px;
}

#bottomLeftImageThumb span.shadow
{
    top: 1px;
    right: -1px;
    left: 1px;
    color: black;
}

#bottomRightImageThumb
{
    position: relative;
    width: 100%;

    border-style: solid;
    border-width: 1px;
    /*float: right;*/
}

#bottomRightImageThumb img
{
    float: center;
}

#bottomRightImageThumb span
{
    text-align: center;
    position: absolute;
    font-weight: bold;
    top: 0px;
    right: 0px;
    left: 0px;
}

#bottomRightImageThumb span.shadow
{
    top: 1px;
    right: -1px;
    left: 1px;
    color: black;
}

#contModeText
{
    position:absolute;
    z-index: 1000000000;
    padding: 6px 8px;
    font: 14px/16px Arial, Helvetica, sans-serif;
    color: #223;
    background-color:rgba(255,255,255,0.8);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
    border-radius: 5px;
    top:10px;
    left:10%;
    right:50%;
    color: red;
}



.assetForm label, #assetForm select, #assetForm textarea,

.carriagewayForm label, .carriagewayForm select, .carriagewayForm textarea,
.manualCarriagewayForm label, .manualCarriagewayForm select, .manualCarriagewayForm textarea,
.footwayForm label, .footwayForm select, .footwayForm textarea,
.manualFootwayForm label, .manualFootwayForm select, .manualFootwayForm textarea,
.carriagewayDataPopup label, .carriagewayDataPopup select, .carriagewayDataPopup textarea,
.footwayDataPopup label, .footwayDataPopup select, .footwayDataPopup textarea,
.splitCarriagewayForm label, .splitCarriagewayForm select, .splitCarriagewayForm textarea,
.splitFootwayForm label, .splitFootwayForm select, .splitFootwayForm textarea,
.kerbForm label, .kerbForm select, .kerbForm textarea
{
    margin-bottom: 0px;
    font-size: 11px;
    height: 23px;
}


.footwayForm textarea, .splitFootwayForm textarea
{
    max-width:75%;
}

.footwayDataPopup textarea
{
    max-width:75%;
}

.kerbForm textarea
{
    max-width:75%;
}

.carriagewayForm .control-group,
.manualCarriagewayForm .control-group,
.footwayForm .control-group,
.manualFootwayForm .control-group,
.carriagewayDataPopup .control-group,
.footwayDataPopup .control-group,
.splitCarriagewayForm .control-group,
.splitFootwayForm .control-group,
.kerbForm.control-group,
.assetForm
{
    margin-bottom: 1px;
}

.carriagewayForm .form-actions,
.manualCarriagewayForm .form-actions,
.footwayForm .form-actions,
.manualFootwayForm .form-actions,
.carriagewayDataPopup .form-actions,
.footwayDataPopup .form-actions,
.splitCarriagewayForm .form-actions,
.splitFootwayForm .form-actions,
.assetForm
{
    margin-top: 5px;
    padding: 5px 20px 2px;
}



.kerbForm .form-actions
{
    display: none ;
}

.kerbForm .form-actions
{
    display: none ;
}

.carriagewayForm .leaflet-popup-content h3,
.manualCarriagewayForm .leaflet-popup-content h3,
.footwayForm .leaflet-popup-content h3,
.manualFootwayForm .leaflet-popup-content h3,
.carriagewayDataPopup .leaflet-popup-content h3,
.footwayDataPopup .leaflet-popup-content h3,
.splitCarriagewayForm .leaflet-popup-content h3,
.splitFootwayForm .leaflet-popup-content h3,
.kerbForm .leaflet-popup-content h3,
.assetForm .leaflet-popup-content h3
{
    line-height: 4px;
}
/*
#kerbModal
{
	top:5%;
	right:50%;
	left:25%;
	outline: none;
}
*/

#kerbModal
{
    color: black;
    text-color: black;
    top:5%;
    left:25%;
}
/*
<<<<<<< HEAD
.modal-backdrop
{home
=======
*/
#assetModal
{
    color: black;
    text-color: black;
    top:5%;
    left:25%;
    width:35%;
}

#editAssetModal
{
    color: black;
    text-color: black;
    top:5%;
    left:25%;
}

#exportModal
{
    color: black;
    text-color: black;
    /*
    top:5%;
    left:25%;
    */
}

#exportButImg
{
    margin-top: 6px;
    float: right;
}


#changePasswordBut
{
    margin-top: 6px;
    float: right;
}

.modal-backdrop {
    /*>>>>>>> feature/assetSupport*/
    background-color: transparent;
    display: none;
}

.navbar-inner
{
    background-color: #375a7f;
    border-color: #000000;
    background-image:none;
}

.navbar-default
{
    color: #ffffff;
}

#jsonform-0-elt-damageWidth
{
    width: 140px;
}