@import url(https://fonts.googleapis.com/css?family=Open+Sans);
.nucloud-map {
    font-family: 'Open Sans', sans-serif;
}

.infowindow * {
    box-sizing: border-box;
}

.infowindow {
    box-sizing: border-box;
    margin: 0 auto;
    color: #fff;
    background: rgba(35, 35, 35, 0.97);
    box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    /*Center Vertically*/
    
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.infowindow a {
    color: #ccc;
    text-decoration: underline;
}
/****HEADER****/

.infowindow header {
    position: relative;
    padding: 20px 20px 10px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.infowindow header div.title {
    color: #fff;
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    line-height: 24px;
    width: 70%;
    display: inline-block;
}

/** Header Tools ***/
.infowindow header .tool {
    float:right;
    margin-right: 10px;
    display: inline-block;
}
.infowindow header .tool a {
    color: #fff;
    text-decoration: none;
    font-size: 20px;
}

.infowindow header .tool a:hover {
    color: #ccc;
    background: none;
    text-decoration: none;
}

/****Description****/

.infowindow .description .desc-inner {
    padding: 10px;
    color: #fff;
    font-size: 14px;
    line-height: 20px;/*Scrollbar plugin must have a static height or max-height*/
    height: 100%;
    max-height: 650px;
}

.infowindow .description .desc-inner p {
    padding: 0;
    margin: 0 0 10px 0;
    font-size: inherit;
    line-height: inherit;
}
/**** Share Dialog ****/
.share-dialog {
    
}

/****Viewer****/

.infowindow .viewer-inner {/*Scrollbar plugin must have a static height or max-height*/
    
    height: 100%;
    max-height: 650px;
    padding: 20px;
    overflow: hidden;
    position: relative;
}

.infowindow .viewer img {
    width: 100%;
/**Center Viewer Image so top and bottom are equally affected by overflow**/
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
/* End Center Image */
}

.viewer-inner figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    height: auto;
    max-height: 120px;
    overflow-y: auto;
    margin: 0;
    padding: 10px;
    font-size: 12px;
    background: rgba(0, 0, 0, 0.6);
    color: #fff; 
    display: none;
}

.infowindow .viewer iframe {
    width: 100%;
    height: 100%;
}
/****Gallery****/

.infowindow .gallery {
    position: absolute;
    bottom: 75px;/*height of footer and audio player*/
    
    overflow: hidden;
    height: auto;/*Height controlled by img sizes*/
    
    width: 100%;
    padding: 20px 20px 0 20px;
}

.infowindow .thumbnails p {
    float: left;
    padding: 0 5px 10px 5px;
    margin: 0;
}

.infowindow .thumbnails img {
    border:1px solid #999;
}

.infowindow .thumbnails .active img {
    border-color: #999
}

.infowindow .thumbnails img:hover {
    border-color: #666;
}
/****FOOTER****/

.infowindow .default-footer {
    clear: both;
    height: 50px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.infowindow .default-footer .audio-player {
    position: absolute;
    margin: 0;
    bottom: 50px;
    width: 100%;
    display: none;
}

.default-footer .audio-player audio {
    width: 100%;
    height: 23px;
}

.infowindow .default-footer .paging {
    margin-top: 10px;
}

.infowindow .default-footer .prevpage {
    position: absolute;
    left: 20px;
}

.infowindow .default-footer .nextpage {
    position: absolute;
    right: 20px;
}

.infowindow .default-footer .paging a {
    color: #fff;
    text-decoration: none;
    font-size: 16px;
}

.infowindow .default-footer .paging a:hover {
    color: #ccc;
}

.infowindow .default-footer .paging a i {
    vertical-align: middle;
}
/***********************
#### LEGEND ####
***********************/

.nucloudMapLegend * {
    box-sizing: border-box;
}

.nucloudMapLegend {
    width: 80%;
    background: rgba(255, 255, 255, 0.95);
    border-left: 1px solid #999;
}

.legend-rightside-closed {
    right: -80% !important;
}

.legend-leftside-closed {
    left: -80% !important;
}

.nucloudMapLegend .header {
    text-align: left;
    font-size: 18px;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}

.nucloudMapLegend .search {
    box-sizing: border-box;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    padding: 10px;
    margin: 0;
    font-size: 12px;
}

.nucloudMapLegend .search .search-filter,
.nucloudMapLegend .search .layer-filter {
    width: 100%;
}

.nucloudMapLegend .search .layer-filter {
    margin-top: 10px;
}

.nucloudMapLegend .list {}

.nucloudMapLegend .list .item {
    height: auto;
    position: relative;
    padding: 10px;
}

.nucloudMapLegend .list .item .icon {
    position: absolute;
    top: 25%;
    left: 10px;
}

.nucloudMapLegend .list .item .title{
    display:block;
    margin-left:30px;
    font-size:12px;
    line-height:20px;
}
.nucloudMapLegend .list .item .icon img{
    max-width:25px;
}

.nucloudMapLegend .list .item .title {
    display: block;
    margin-left: 30px;
    font-size: 12px;
    line-height: 20px;
}

.nucloudMapLegend .list .item .layers {
    display: none;
}

.nucloudMapLegend.leftside .legendControlSide{
    border-radius: 0 5px 5px 0 ;
}

.nucloudMapLegend.rightside .legendControlSide{
    border-radius: 5px 0 0 5px ;
}

/***********************
Stop Title Hover Over
***********************/

.nucloud-map .highlightMarker {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #666;
    color: #000;
    padding: 10px;
    height: auto;
    font-size: 14px;
    box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.9);
}
/***********************
Map Controls
***********************/

.nucloud-map .showLegendContol {
    
}

.nucloud-map .showLegendContol i {

}

.nucloud-map .legendClose {
    float: right;
    color: #555;
    cursor: pointer;
}

.nucloud-map .ol-zoom {}

.nucloud-map .ol-zoom button {
    color: #fff;
    background: #333;
}

.nucloud-map .basemap-control{
    z-index:2;
}

/**************************
Contact Form Toggle
**************************/
.contact-form .toggle-contact-form-btn{background:#333; padding:10px; right:0; z-index:1;}
.contact-form .toggle-contact-form-btn:hover{color:#999; background:#222;}

/*Contact Form*/
.contact-form .md-modal{
box-sizing:border-box; 
overflow:auto;
color: #fff;
background: rgba(35, 35, 35, 0.9);
box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.5);
border-radius: 10px;
}

.contact-form .md-content h3{
text-align:left;
color: #fff;
margin: 0;
font-size: 20px;
line-height: 24px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.contact-form .md-content{
font-size: 14px;
line-height: 20px
}

.contact-form .md-content button {
margin-top:20px;
border:none;
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.contact-form .md-content button:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

.contact-form form{
}

.contact-form form ul{
padding:0; 
margin:0;
}

.contact-form form ul li{}

.contact-form input[type=text],.contact-form input[type=password],.contact-form input[type=email],.contact-form input[type=url],.contact-form input[type=date],.contact-form input[type=month],.contact-form input[type=time],.contact-form input[type=datetime],.contact-form input[type=datetime-local],.contact-form input[type=week],.contact-form input[type=number],.contact-form input[type=search],.contact-form input[type=tel],.contact-form input[type=color],.contact-form select,.contact-form textarea{padding:.5em .6em;display:block; width:100%; border:1px solid #ccc;box-shadow:inset 0 1px 3px #ddd;border-radius:4px;vertical-align:middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; color:#333;}
.contact-form input:not([type]){padding:.5em .6em;display:inline-block;border:1px solid #ccc;box-shadow:inset 0 1px 3px #ddd;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.contact-form input[type=color]{padding:.2em .5em}
.contact-form input[type=text]:focus,.contact-form input[type=password]:focus,.contact-form input[type=email]:focus,.contact-form input[type=url]:focus,.contact-form input[type=date]:focus,.contact-form input[type=month]:focus,.contact-form input[type=time]:focus,.contact-form input[type=datetime]:focus,.contact-form input[type=datetime-local]:focus,.contact-form input[type=week]:focus,.contact-form input[type=number]:focus,.contact-form input[type=search]:focus,.contact-form input[type=tel]:focus,.contact-form input[type=color]:focus,.contact-form select:focus,.contact-form textarea:focus{outline:0;border-color:#129FEA}
.contact-form input:not([type]):focus{outline:0;border-color:#129FEA}
.contact-form input[type=file]:focus,.contact-form input[type=radio]:focus,.contact-form input[type=checkbox]:focus{outline:thin solid #129FEA;outline:1px auto #129FEA}

.contact-form .frmb-choices,.contact-form .frmb-choices{margin:.5em 0;display:block}
.contact-form input[type=text][disabled],.contact-form input[type=password][disabled],.contact-form input[type=email][disabled],.contact-form input[type=url][disabled],.contact-form input[type=date][disabled],.contact-form input[type=month][disabled],.contact-form input[type=time][disabled],.contact-form input[type=datetime][disabled],.contact-form input[type=datetime-local][disabled],.contact-form input[type=week][disabled],.contact-form input[type=number][disabled],.contact-form input[type=search][disabled],.contact-form input[type=tel][disabled],.contact-form input[type=color][disabled],.contact-form select[disabled],.contact-form textarea[disabled]{cursor:not-allowed;background-color:#eaeded;color:#cad2d3}
.contact-form input:not([type])[disabled]{cursor:not-allowed;background-color:#eaeded;color:#cad2d3}
.contact-form input[readonly],.contact-form select[readonly],.contact-form textarea[readonly]{background-color:#eee;color:#777;border-color:#ccc}
.contact-form input:focus:invalid,.contact-form textarea:focus:invalid,.contact-form select:focus:invalid{color:#b94a48;border-color:#e9322d}
.contact-form input[type=file]:focus:invalid:focus,.contact-form input[type=radio]:focus:invalid:focus,.contact-form input[type=checkbox]:focus:invalid:focus{outline-color:#e9322d}
.contact-form select{height:2.25em;border:1px solid #ccc;background-color:#fff}
.contact-form select[multiple]{height:auto}
.contact-form label{margin:.5em 0 .2em}
.contact-form fieldset{margin:0;padding:.35em 0 .75em;border:0}
.contact-form legend{display:block;width:100%;padding:.3em 0;margin-bottom:.3em;color:#333;border-bottom:1px solid #e5e5e5}

.contact-form .frmb-choices{padding-left:10px;}
.contact-form .frmb-choices li{padding:0; margin:0;}
.contact-form .frmb-choices li label{}
.contact-form .frmb-choices li input{float:left; margin-right:10px;}


@media (max-width: 499px) {
.contact-form .md-modal{
height:auto; 
max-height:100%;
width:100%;}
}

@media (min-width: 500px) {
.contact-form .md-modal{
height:auto; 
max-height:100%;
width:90%;}
}

@media (min-width: 750px) {

}

@media (min-width: 1000px) {

}




/***********************
#### LAYOUTS ####
***********************/
/*Layout Small Thumbnails*/

.nucloud-map .layout-small-thumbs .description {
    width: 40%;
    float: right;
    margin: 0;
    padding: 0;
}

.nucloud-map .layout-small-thumbs .viewer {
    width: 60%;
    float: left;
    overflow: hidden;
}

.nucloud-map .layout-small-thumbs .gallery {
    float: left;
    width: 60%;
}
/*Layout Left Thumbnails*/

.nucloud-map .layout-left .description {
    width: 40%;
    float: right;
    margin: 0;
    padding: 0;
}

.nucloud-map .layout-left .viewer {
    width: 60%;
    float: left;
    overflow: hidden;
}

.nucloud-map .layout-left .desc-inner {}

.nucloud-map .layout-left .gallery {
    clear: both;
    width: 100%;
}
/*Layout  Right Thumbnails*/

.nucloud-map .layout-right .description {
    width: 40%;
    float: left;
    margin: 0;
    padding: 0;
}

.nucloud-map .layout-right .viewer {
    width: 60%;
    float: right;
    overflow: hidden;
}

.nucloud-map .infowindow .layout-right .gallery {
    clear: both;
}
/**************************
    Height BREAKPOINTS
**************************/

@media (max-height: 420px) {
    
    .infowindow {
        height: 100%;
    }
    .infowindow .description,
    .infowindow .viewer {
        height: 50%;
    }
    /*Gallery*/
    
    .infowindow .thumbnails img {
        height: 50px;
        width: 50px;
        margin-right: 10px;
    }
    .infowindow .gallery .mCSB_horizontal {
        height: 70px;
    }
    /*Thumbnail height + gallery padding*/
    
    .infowindow .gallery {
        bottom: 23px;
    }
    /*Remove Footer*/
    
    .infowindow .default-footer .paging {
        display: none;
    }
    .infowindow .default-footer {
        height: 23px;
        border-top: none;
    }
    .infowindow .default-footer .audio-player {
        bottom: 0px;
    }
}

@media (min-height: 420px) {
    
    .infowindow {
        height: 95%;
    }
    .default-footer {
        display: block;
    }
    .infowindow .description,
    .infowindow .viewer {
        height: 50%;
    }
    /*Gallery*/
    
    .infowindow .thumbnails img {
        height: 80px;
        width: 80px;
        margin-right: 10px;
    }
    .infowindow .gallery .mCSB_horizontal {
        height: 100px;
    }
    /*Thumbnail height + gallery padding*/
    .infowindow header .tool a .text {
        display:none;
    }
}

@media (min-height: 700px) {
    .infowindow .description,
    .infowindow .viewer {
        height: 60%;
    }
    /*Gallery*/
    
    .infowindow .thumbnails img {
        height: 100px;
        width: 100px;
        margin-right: 10px;
    }
    .infowindow .gallery .mCSB_horizontal {
        height: 120px;
    }
    /*Thumbnail height + gallery padding*/
}

@media (min-height: 900px) {
    
    .infowindow {
        height: 80%;
    }
}

/**************************
    Width BREAKPOINTS
**************************/

@media (max-width: 509px) {

    .infowindow {
        height: 100%;
        width: 100%;
        border-radius: 0;
        overflow: auto;
    }
    .infowindow .description .desc-inner {
        padding: 10px;
    }
    .infowindow .viewer-inner {
        padding: 0;
        overflow: hidden;
    }
    /*Gallery*/
    
    .infowindow .thumbnails img {
        height: 50px;
        width: 50px;
        margin-right: 10px;
    }
    .infowindow .gallery {
        bottom: 23px;
    }
    .infowindow .gallery .mCSB_horizontal {
        height: 70px;
    }
    /*Thumbnail height + gallery padding*/
    
    .infowindow .description,
    .infowindow .viewer {
        height: 30%;
    }
    /*Remove Footer*/
    
    .infowindow .default-footer .paging {
        display: none;
    }
    .infowindow .default-footer {
        height: 23px;
        border-top: none;
    }
    .infowindow .default-footer .audio-player {
        bottom: 0px;
    }
    /*Layout Support*/
    
    .nucloud-map .layout-left .description,
    .nucloud-map .layout-right .description,
    .nucloud-map .layout-small-thumbs .description {
        width: 100%;
    }
    .nucloud-map .layout-left .viewer,
    .nucloud-map .layout-right .viewer,
    .nucloud-map .layout-small-thumbs .viewer {
        width: 100%;
    }
    .nucloud-map .description .desc-inner,
    .nucloud-map .viewer-inner {
        max-height: 200px;
    }
}
/* Larger than tablet */

@media (min-width: 510px) {
    .infowindow {
        width: 90%;
    }
    .infowindow .description .desc-inner {
        padding: 10px;
    }
    .infowindow .viewer-inner {
        padding: 20px;
        overflow: hidden;
    }
    .nucloudMapLegend {
    width:30%;
    }
    
    .legend-rightside-closed {
    right: -30% !important;
}
    .legend-leftside-closed {
    left: -30% !important;
}

}


/* Larger than desktop */

@media (min-width: 750px) {
    .infowindow {
        width: 80%;
    }
    .infowindow .description .desc-inner {
        padding: 10px;
    }
    .infowindow .viewer-inner {
        padding: 20px;
        overflow: hidden;
    }
}
/* Larger than Desktop HD */

@media (min-width: 1000px) {
    .infowindow {
        width: 70%;
        max-width: 1000px;
    }
    .infowindow .description .desc-inner {
        padding: 10px;
    }
    .infowindow .viewer-inner {
        padding: 20px;
        overflow: hidden;
    }
}

/***Responsive Single Column******/
@media (max-width: 499px) and (max-height: 420px) {
.infowindow .description{height:30%;}
.nucloud-map .viewer-inner{max-height: 100px;}
}

@media (max-width: 499px) and (min-height: 421px) {
.infowindow .description{height:30%;}
}

@media (max-width: 499px) and (min-height: 521px) {
.infowindow .description{height:35%;}
.nucloud-map .description .desc-inner{max-height: 300px;}
}

@media (max-width: 499px) and (min-height: 600px) {
.infowindow .description{height:40%;}
}

@media (max-width: 499px) and (min-height: 700px) {
.infowindow .description{height:45%;}
.nucloud-map .description .desc-inner{max-height: 400px;}
}

@media (max-width: 499px) and (min-height: 700px) {
.infowindow .description{height:45%;}
}