.out-wrapper {
    font-size: 0;
}

.out-wrapper > div {
    font-size: 16px;
}

.header {
    padding: 20px 0;
}

.header .header-container .logo {
    vertical-align: bottom;
    display: inline-block;
}

.header .header-container .logo img {
    width: 200px;
}

.header .header-container ul {
    vertical-align: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.header .header-container li {
    float: left;
    margin-left: 20px;
}

.header .header-container li a {
    display: block;
    color: white;
    text-align: center;
    padding: 16px;
    text-decoration: none;
    font-size: 20px;
}

.header .header-container li a:hover {
    background-color: #E0E0E0;
}

.left-side .form-holder {
    padding: 15px;
    background-color: #E0E0E0;
}

.left-side .form-holder h1 {
    text-align: center;
    font-size: 35px;
}

.left-side .form-holder form .bottom-form {
    margin-top: 20px;
}

.left-side .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.left-side .clearfix {
    *zoom: 1;
    display: inline-table;
}

.left-side * html .clearfix {
    height: 1%;
}

.left-side .clearfix {
    display: block;
}

.left-side .button {
    display: inline-block;
    padding: 5px 10px;
    border: 1px solid #999;
    border-radius: 3px;
    cursor: pointer;
}

.left-side .button:hover {
    box-shadow: 0 0 5px #aaa;
}

.left-side ol.linenums {
    padding: 0;
}

.left-side .wrapper {
    min-width: 400px;
    max-width: 1024px;
    margin: 0 auto;
    padding: 20px 0 60px;
}

.left-side .inner {
    width: 1024px;
    margin: 0 auto;
}

.left-side .inner-left {
    float: left;
    width: 48%;
}

.left-side .inner-right {
    float: right;
    width: 48%;
}

.left-side .topbar {
    background: #222;
}

.left-side .topbar ul {
    margin: 0;
    padding: 0;
}

.left-side .topbar li {
    float: left;
    list-style: none;
}

.left-side .topbar li a {
    display: block;
    padding: 10px 20px;
    color: #61b2a8;
    font-size: 18px;
    text-decoration: none;
}

.left-side .topbar li a:hover {
    background: #333;
}

.left-side .topbar li a.active {
    background: #61b2a8;
    color: #000;
}

.left-side #gototop {
    position: fixed;
    bottom: 3px;
    right: 3px;
    padding: 10px;
    background: #61B2A8;
    color: #FFF;
    cursor: pointer;
}

.left-side #gototop:hover {
    opacity: 0.9;
}

.left-side .documentation {
    background: #61B2A8;
    padding: 15px 0;
    border-bottom: 1px solid #888;
    text-shadow: 1px 1px 2px #555;
    color: #FFF;
    font-size: 30px;
    font-weight: bold;
}

.left-side .docs {
    min-width: 400px;
    max-width: 1024px;
    margin: 0 auto;
}

.left-side .docs .nav {
    position: fixed;
    left: 50%;
    top: 127px;
    bottom: 0;
    width: 25%;
    max-width: 256px;
    margin-left: 256px;
    padding: 20px 20px 60px 20px;
    overflow-y: auto;
}

.left-side .docs .content {
    margin-right: 25%;
    padding-bottom: 60px;
    padding-right: 10px;
}

.left-side .docs .content h1 {
    padding: 10px 20px;
    margin-bottom: 20px;
    margin-top: 30px;
    border: 1px solid #999;
    border-radius: 10px;
    background: #61B2A8;
    color: #FFF;
}

.left-side .docs .content h2 {
    color: #333;
}

.left-side .docs .content h3 {
    border-left: 3px solid #784942;
    color: #784942;
    padding-left: 10px;
}

.left-side .skins .paginationjs {
    margin-top: 10px;
}

.left-side .nav-section .nav-section-title {
    font-size: 20px;
}

.left-side .nav-section .nav-section-title > a {
    display: block;
    color: #333;
    text-decoration: none;
}

.left-side .nav-section .nav-section-item {
    display: none;
    padding: 1px 0 1px 24px;
    text-decoration: none;
    color: #61B2A8;
}

.left-side .nav-section .nav-section-item:hover {
    background: rgba(97, 178, 168, 0.1);
}

.left-side .nav-section .nav-section-item.active {
    border-left: 2px solid #6FBFA8;
    padding-left: 22px;
    font-weight: bold;
}

.left-side .nav-section.active .nav-section-title {
    border-left: 2px solid #333;
    padding-left: 10px;
}

.left-side .nav-section.active .nav-section-item {
    display: block;
}

.left-side .header {
    background: #61b2a8;
    padding: 80px 0;
    border-bottom: 1px solid #888;
    text-shadow: 1px 1px 2px #555;
    text-align: center;
    color: #fff;
}

.left-side .header .title {
    font-size: 60px;
}

.left-side .header .title span {
    font-size: 0.5em;
    margin-left: 20px;
    color: #B0D8D2;
}

.left-side .header .desc {
    font-size: 20px;
}

.left-side .header .download {
    margin-top: 1em;
}

.left-side .header .download .build-buttons a {
    display: inline-block;
    padding: 6px 24px;
    font-size: 21px;
    border-radius: 5px;
    border: 1px solid #659B94;
    text-decoration: none;
    background: #DEEFEC;
    color: #666;
    text-shadow: 0px 1px 1px #fff;
    transition: background 0.3s;
}

.left-side .header .download .build-buttons a .fileSize {
    font-size: 12px;
    color: #61B2A8;
    font-weight: bold;
}

.left-side .header .download .build-buttons a:hover {
    background: #C0E5DF;
}

.left-side .header .download .build-buttons a.active {
    background: #C0E5DF;
}

.left-side .header .download .build-buttons.build-buttons-styles a {
    padding: 0px 24px;
    font-size: 14px;
    text-decoration: underline;
    color: #eee;
    border: none;
    background: none;
    text-shadow: none;
}

.left-side .header .download .build-buttons.build-buttons-styles a .fileSize {
    color: #eee;
}

.left-side .initialize {
    padding-top: 20px;
    text-align: center;
}

.left-side .section-title {
    font-size: 40px;
    text-align: center;
}

.left-side .demo-section {
    margin-bottom: 20px;
}

.left-side .demo-section .demo-section-title {
    font-size: 40px;
    text-align: center;
}

.left-side .actions {
    padding: 15px 0;
}

.left-side .actions .button {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

.left-side .events-list .title {
    line-height: 2.4em;
    font-weight: bold;
}

.left-side .events-list .events-container .event-item input[type=checkbox] {
    vertical-align: text-bottom;
}

.left-side .events-log .title {
    font-weight: bold;
}

.left-side .events-log .title .button {
    padding: 5px 10px;
}

.left-side .events-log .log-container {
    max-height: 400px;
    min-height: 200px;
    overflow: auto;
    margin: 5px 0 0 0;
    padding: 3px 5px;
    border: 1px solid #ccc;
    border-radius: 3px;
    list-style: none;
}

.left-side .events-log .log-container li {
    line-height: 1.2em;
    font-size: 12px;
    font-family: Verdana, sans-serif;
    list-style: none;
}

.left-side .data-container {
    height: calc(100vh - 345px);
    overflow: auto;
    margin: 15px 0;
}

.left-side .data-container ul {
    margin: 0;
    padding-left: 0;
    height: 950px;
}

.left-side .data-container li {
    border-top: 1px solid #f0f0f0;
    margin-bottom: 3px;
    padding: 8px;
    line-height: 1em;
    list-style: none;
    cursor: pointer;
}

.left-side .data-container li a {
    color: #111;
    font-size: 13px;
    text-decoration: none;
    display: block;
}

.left-side .data-container li a .name {
    width: 58%;
    display: inline-block;
}

.left-side .data-container li a .number {
    width: 35%;
    display: inline-block;
}

.left-side .data-container li:hover a {
    font-weight: 700;
}

.left-side .data-container .loading {
    padding-top: 15%;
    text-align: center;
}

.left-side .paginationjs {
    line-height: 1.6;
    font-family: Marmelad, "Lucida Grande", Arial, "Hiragino Sans GB", Georgia, sans-serif;
    font-size: 14px;
    box-sizing: initial;
    display: flex;
}

.left-side .paginationjs .paginationjs-pages {
    padding: 0 20px 0 0;
}

.left-side .paginationjs .paginationjs-pages ul {
    width: 100%;
    display: flex;
    padding: 0;
}

.left-side .paginationjs .paginationjs-pages li {
    float: left;
    border: 1px solid #aaa;
    border-right: none;
    list-style: none;
}

.left-side .paginationjs .paginationjs-pages li > a {
    min-width: 30px;
    height: 28px;
    line-height: 28px;
    display: block;
    background: #fff;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    text-align: center;
}

.left-side .paginationjs .paginationjs-pages li > a:hover {
    background: #eee;
}

.left-side .paginationjs .paginationjs-pages li.active {
    border: none;
}

.left-side .paginationjs .paginationjs-pages li.active > a {
    height: 30px;
    line-height: 30px;
    background: #aaa;
    color: #fff;
}

.left-side .paginationjs .paginationjs-pages li.disabled > a {
    opacity: 0.3;
}

.left-side .paginationjs .paginationjs-pages li.disabled > a:hover {
    background: 0 0;
}

.left-side .paginationjs .paginationjs-pages li:first-child,
.left-side .paginationjs .paginationjs-pages li:first-child > a {
    border-radius: 3px 0 0 3px;
}

.left-side .paginationjs .paginationjs-pages li:last-child {
    border-right: 1px solid #aaa;
    border-radius: 0 3px 3px 0;
}

.left-side .paginationjs .paginationjs-pages li:last-child > a {
    border-radius: 0 3px 3px 0;
}

.left-side .paginationjs .paginationjs-go-input > input[type=text] {
    width: 30px;
    height: 28px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #aaa;
    padding: 0;
    font-size: 14px;
    text-align: center;
    vertical-align: baseline;
    outline: 0;
    box-shadow: none;
    box-sizing: initial;
}

.left-side .paginationjs .paginationjs-go-button > input[type=button] {
    min-width: 40px;
    height: 30px;
    line-height: 28px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #aaa;
    text-align: center;
    padding: 0 8px;
    font-size: 14px;
    vertical-align: baseline;
    outline: 0;
    box-shadow: none;
    color: #333;
    cursor: pointer;
    vertical-align: middle \9;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-go-input > input[type=text],
.left-side .paginationjs.paginationjs-theme-blue .paginationjs-pages li {
    border-color: #289de9;
}

.left-side .paginationjs .paginationjs-go-button > input[type=button]:hover {
    background-color: #f8f8f8;
}

.left-side .paginationjs .paginationjs-nav {
    height: 30px;
    line-height: 30px;
}

.left-side .paginationjs .paginationjs-go-button,
.left-side .paginationjs .paginationjs-go-input {
    margin-left: 5px \9;
}

.left-side .paginationjs.paginationjs-small {
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-pages li > a {
    min-width: 26px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-pages li.active > a {
    height: 26px;
    line-height: 26px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-go-input {
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-go-input > input[type=text] {
    width: 26px;
    height: 24px;
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-go-button {
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-go-button > input[type=button] {
    min-width: 30px;
    height: 26px;
    line-height: 24px;
    padding: 0 6px;
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-small .paginationjs-nav {
    height: 26px;
    line-height: 26px;
    font-size: 12px;
}

.left-side .paginationjs.paginationjs-big {
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-pages li > a {
    min-width: 36px;
    height: 34px;
    line-height: 34px;
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-pages li.active > a {
    height: 36px;
    line-height: 36px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-go-input {
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-go-input > input[type=text] {
    width: 36px;
    height: 34px;
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-go-button {
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-go-button > input[type=button] {
    min-width: 50px;
    height: 36px;
    line-height: 34px;
    padding: 0 12px;
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-big .paginationjs-nav {
    height: 36px;
    line-height: 36px;
    font-size: 16px;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-pages li > a {
    color: #289de9;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-pages li > a:hover {
    background: #e9f4fc;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-pages li.active > a {
    background: #289de9;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-pages li.disabled > a:hover {
    background: 0 0;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-go-button > input[type=button] {
    background: #289de9;
    border-color: #289de9;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-go-input > input[type=text],
.left-side .paginationjs.paginationjs-theme-green .paginationjs-pages li {
    border-color: #449d44;
}

.left-side .paginationjs.paginationjs-theme-blue .paginationjs-go-button > input[type=button]:hover {
    background-color: #3ca5ea;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-pages li > a {
    color: #449d44;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-pages li > a:hover {
    background: #ebf4eb;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-pages li.active > a {
    background: #449d44;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-pages li.disabled > a:hover {
    background: 0 0;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-go-button > input[type=button] {
    background: #449d44;
    border-color: #449d44;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-go-input > input[type=text],
.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-pages li {
    border-color: #ec971f;
}

.left-side .paginationjs.paginationjs-theme-green .paginationjs-go-button > input[type=button]:hover {
    background-color: #55a555;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-pages li > a {
    color: #ec971f;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-pages li > a:hover {
    background: #fdf5e9;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-pages li.active > a {
    background: #ec971f;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-pages li.disabled > a:hover {
    background: 0 0;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-go-button > input[type=button] {
    background: #ec971f;
    border-color: #ec971f;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-go-input > input[type=text],
.left-side .paginationjs.paginationjs-theme-red .paginationjs-pages li {
    border-color: #c9302c;
}

.left-side .paginationjs.paginationjs-theme-yellow .paginationjs-go-button > input[type=button]:hover {
    background-color: #eea135;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-pages li > a {
    color: #c9302c;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-pages li > a:hover {
    background: #faeaea;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-pages li.active > a {
    background: #c9302c;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-pages li.disabled > a:hover {
    background: 0 0;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-go-button > input[type=button] {
    background: #c9302c;
    border-color: #c9302c;
    color: #fff;
}

.left-side .paginationjs.paginationjs-theme-red .paginationjs-go-button > input[type=button]:hover {
    background-color: #ce4541;
}

.left-side .paginationjs .paginationjs-pages li.paginationjs-next {
    border-right: 1px solid #aaa \9;
}

.left-side .paginationjs .paginationjs-go-input > input[type=text] {
    line-height: 28px \9;
    vertical-align: middle \9;
}

.left-side .paginationjs.paginationjs-big .paginationjs-pages li > a {
    line-height: 36px \9;
}

.left-side .paginationjs.paginationjs-big .paginationjs-go-input > input[type=text] {
    height: 36px;
    line-height: 36px;
}

#passport ul.tabs {
    margin-top: 30px;
    list-style: none;
}

#passport ul.tabs li {
    background: none;
    color: #222;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
}

#passport ul.tabs li.current {
    background: #ededed;
    color: #222;
    font-weight: 700;
}

#passport .tab-content {
    display: none;
    padding: 15px;
}

#passport .tab-content.current {
    display: inherit;
}

#passport ul.clasificatie-list {
    list-style: none;
}

#passport ul.clasificatie-list li {
    border-top: 1px solid #f0f0f0;
    font-weight: bold;
    padding: 10px 0;
}

#passport ul.clasificatie-list li .field {
    display: inline-block;
    width: 20%;
}

#passport ul.clasificatie-list li .value {
    display: inline-block;
}

#passport table.algemeen-table tr {
    height: 40px;
}

#passport table.algemeen-table tr .ks-pagetitle {
    font-weight: bold;
}

#passport .table {
    margin-left: 50px;
    width: 40%;
}

#passport ul.ligging-list {
    margin-top: 40px;
    list-style: none;
}

#passport ul.ligging-list li {
    border-top: 1px solid #f0f0f0;
    font-weight: bold;
    padding: 10px 0;
}

#passport ul.ligging-list li .field {
    display: inline-block;
    width: 20%;
}

#passport ul.ligging-list li .value {
    display: inline-block;
}

#map {
    width: 100%;
    height: 100%;
}

@media only screen and (max-width: 1920px) {
    .main-container .col-lg-2 {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .main-container .col-lg-10 {
        flex: 0 0 75%;
        max-width: 75%;
    }
}

@media only screen and (max-width: 1366px) {
    .head-form {
        flex-direction: column;
    }

    .head-form .col-lg-3,
    .head-form .col-lg-9 {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: center;
        align-items: center;
        display: flex;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 1024px) {
    .header-container,
    .main-container {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .main-container .col-lg-2 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .main-container .col-lg-10 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .header-container .buttons-container {
        padding: 20px;
        justify-content: center;
        margin-top: 20px;
    }

    #main, #main #map {
        height: 600px;
    }
}

.content-infowindow {
    text-align: center;
    height: 400px;
    width: 500px;
    cursor: default;
    padding: 5px;
}

.content-infowindow button {
    width: 100%;
    margin-top: 10px;
    float: contour;
    border: none;
    background-color: #E0E0E0;
    padding: 7px 0px;
}

.content-infowindow button:hover {
    background-color: #B6B6B6;
}

.content-infowindow span {
    font-size: 18px;
    font-weight: bold;
}

.content-infowindow #street-view {
    width: 100%;
    margin-top: 10px;
    height: 100%;
}

.content-infowindow .infowindow-name {
    margin-left: 10px;
}

.overlay {
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5); /* Black background with opacity */
    z-index: 3; /* Specify a stack order in case you're using a different order for other elements */
}

.overlay .spinner-container {
    position: absolute;
    top: 50%;
    left: 50%;
}

.overlay .spinner-container .spinner-border {
    width: 3rem;
    height: 3rem;
}

.map-object-info {
    background: #fff;
    padding: 10px;
    border-radius: .5rem;
    position: absolute;
    bottom: .5rem;
    right: 5rem;
    z-index: 2;
}