#banner-container, div#banner {
    /*margin-top: -134px;*/
    margin-top: -20px;
    position: relative;
    /*float: left;*/
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: #432b1f;
}

p {
    color: #4c514b;
}

h2 {
    padding-top: 16px;
    line-height: 1.2;
}

h3 {
    padding-bottom: 14px;
}

h1.center,
h2.center,
h3.center {
    text-align: center;
}

#banner-container, .banner-top, body, div#banner {
    position: relative
}

.facebook-page-name a {
    color: #432b1f;
}

#jsddm b {
    font-size: 20px;
}

body {
    background-color: #FFF
}

.frame {
    height: 160px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#diensten h3 {
    color: #432b1f;
    letter-spacing: 5px;
    margin: 16px 0 0 0;
}

#diensten h4 {
    color: #432b1f;
    margin: 0 0 16px 0;
    min-height: 40px;
}

.facebook-page-name {
    text-align: left;
    font-weight: bold;
}

#content {
    /*margin-top: -105px;*/
    margin-top: -20px;
    /*float: left;*/
    clear: both;
    width: 100%;
    z-index: 0;
    position: relative;
}

#content #banner {
    height: 350px;
    position: relative;
    width: 100vw;
    z-index: 0;
    background-image: url("../img/banner-content.jpeg");
}

#content #banner .layer {
    height: 100%;
    width: 100%;
    background-color: rgba(100, 165, 49, 0.7);
}

#content #banner .layer h1 {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100%;
    color: #FFF;
    font-size: 100px;
    font-weight: lighter;
    /*text-shadow: 1px 1px 3px #000;*/
}

#content h1, #content .intro h2, #content .title h2 {
    text-transform: uppercase;
}

#diensten .intro h2 {
    font-size: 40px;
    font-weight: 400;
}

#content .image a {
    display: flex;
    flex-wrap: nowrap;
}

#content .image {
    margin-bottom: 10px;
}

#links .col-xs-12 a:last-child {
    font-weight: bold;
    margin-top: 20px;
}

#content p.intro,
#content .intro p {
    color: rgb(67 43 31);
    font-weight: 500;
    letter-spacing: 2px;
}

div.over-ons {
    text-align: center;
    padding: 50px 100px;
    float: left;
}

@media (max-width: 600px) {
    div.over-ons {
        padding-left: 0;
        padding-right: 0;
    }
}


#content .title {
    height: 300px;
    background-color: rgba(100, 165, 49, 1);
    position: relative;
}

.facebook-content-content {
    text-align: left;
    clear: both;
}

#content .title .corners-top {
    border-top: 55px solid #fff;
    border-bottom: 55px solid transparent;
    border-left: 50vw solid transparent;
    border-right: 50vw solid #fff;
    position: absolute;
    top: 0;
}

#content .title .corners-bottom {
    border-bottom: 55px solid #fff;
    border-top: 55px solid transparent;
    border-right: 50vw solid transparent;
    border-left: 50vw solid #fff;
    position: absolute;
    bottom: 0;
}

#content .title h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #FFF;
    font-size: 65px;
    font-weight: lighter;
    text-align: center;
    transform: rotate(5deg);
}

#content h3 {
    font-size: 22px;
}

#content #banner .corners-top {
    border-top: 55px solid #fff;
    border-bottom: 55px solid transparent;
    border-left: 50vw solid transparent;
    border-right: 50vw solid #fff;
    position: absolute;
    top: 0;
}

#content #banner .corners-bottom {
    border-bottom: 55px solid #fff;
    border-top: 55px solid transparent;
    border-right: 50vw solid transparent;
    border-left: 50vw solid #fff;
    position: absolute;
    bottom: 0;
}


#content ul, #content ol {
    /*float: left;*/
    /*text-align: left;*/
    /*list-style: none;*/
    /*padding-left: 0;*/
}

#content li {
    /*padding: 7px 0;*/
}

nav .layer {
    float: left;
}

#hidden-iframes {
    display: none !important;
}

#jsddm, #jsddm li, nav {
}

#jsddm li, #pull {
    text-align: center
}

#bannercontent h1, #stormschade h2 {
    letter-spacing: 12px
}

#bannercontent, #jsddm, #pull:before, #stormschade h2, #stormschade-text h2, .btn-primary, footer h3 {
    text-transform: uppercase
}

#diensten .intro p {
    font-size: 16px;
    letter-spacing: 3px;
}

#diensten p {
    font-size: 13px;
}

footer {
    letter-spacing: 0;
}

body {
    font-family: Roboto, sans-serif;
    color: #333;
    letter-spacing: 2px;
}

body, html {
    overflow-x: hidden
}

#facebook-content {
    padding: 15px 30px;
    position: relative;
    width: 100%;
    /*border: 1px solid rgba(100, 165, 49, 1);*/
}

.fb-page {
    width: 100%;
}

#facebook-content-content {
    padding-top: 5px;
}

#banner-container {
    width: 100%
}

#banner {
    background-image: url("../img/banner.jpg");
    height: 650px;
    width: 100vw;
    background-position: center center;
    background-size: cover;
    position: relative;
    z-index: 0;
}

.thumbnailimage img {
    min-height: 150px;
}

#facebook {
    text-align: center;
}

.list .row .item {
    min-height: 150px;
    min-width: 175px;
}

#facebook .facebook-content-date {
    -ms-display: none;
    font-size: 11px;
    font-style: italic;
    color: rgb(175, 175, 175);
    text-align: left;
}

.list .item img {
    height: 150px;
    width: 100%;
    object-fit: cover;
}

#facebook #facebook-content-attachments {
    /*display: flex;*/
}

[data-facebook-id] {
    margin-bottom: 30px;
}

#facebook-content header {
    display: flex;
    align-items: center;
}

#facebook-content-view-post img {
    max-width: 35px;
    max-height: 35px;
}

.banner-top {
    width: 0;
    height: 0;
    border-left: 50vw solid rgba(100, 165, 49, 1);
    border-right: 50vw solid rgba(255, 255, 255, .3);
    border-top: 55px solid transparent;
    border-bottom: 55px solid transparent;
    z-index: 1;
    position: absolute;
    top: 0;
}

.banner-top-top {
    border-left: 50vw solid transparent;
    border-right: 50vw solid transparent;
    border-top: 55px solid rgb(255, 255, 255);
    z-index: 1;
    position: absolute;
    top: 0;
}

.banner-bottom-bottom, .banner-bottom-right {
    width: 0;
    height: 0;
    border-top: 55px solid transparent;
    bottom: 0
}

.banner-bottom-bottom {
    position: absolute;
    z-index: 3;
    border-left: 50vw solid rgba(255, 255, 255, .3);
    border-right: 50vw solid transparent;
    border-bottom: 55px solid rgba(255, 255, 255, 1)
}

.banner-bottom-right {
    position: absolute;
    z-index: 1;
    right: 0;
    border-right: 50vw solid rgba(100, 165, 49, 1);
    border-bottom: 55px solid transparent
}

#diensten *, p {
    position: relative
}

h2 {
    letter-spacing: 6px;
}

#banner .green, #banner .image {
    height: 450px
}

#banner img {
    height: 450px;
    position: absolute;
    bottom: 1px;
    right: -100px;
    z-index: 2;
}

#banner .overlay {
    width: 100%;
    height: 100%;
    background-color: rgba(100, 165, 49, 0.3);
}

nav .layer {
    z-index: 10
}

#site-header {

}

nav .layer img.logo {
    margin-top: 24px;
    height: 100px;
    z-index: 10;
    position: relative;
    width: 200px;
}

p {
    z-index: 10
}

#bannercontent h1 {
    font-size: 66px;
    line-height: 85px;
    margin-top: 200px;
    color: #fff;
    font-weight: 100;
    padding-bottom: 30px;
}

.layer h1, .layer h2, #stormschade h2 {
    color: #fff;
}

/*#jsddm>li:last-child a i {*/
/*  font-weight: normal;*/
/*}*/

a {
    color: #65a431
}

a:active, a:focus, a:hover {
    color: #4e7a24;
    text-decoration: none
}

#diensten p {
    line-height: 2em;
}

#diensten * {
    z-index: 10
}


footer #footer-content a {
    color: #4c514b;
    display: flex;
    align-items: center
}

#jsddm {
    list-style: none;
    padding-left: 0;
    /*float: right;*/
    display: flex;
    align-items: center;
    flex-flow: row wrap;
}

#jsddm li {
    float: left;
    margin: 0px 7px;
}

#jsddm li a {
    border-bottom: 1px solid #FFF;
    color: #412823;
    margin: 10px 15px;
    float: left;
    font-weight: bold;
    letter-spacing: 3px;
    padding-bottom: 8px;
    padding-left: 8px;
    padding-right: 8px;
}

#jsddm li a:hover, #jsddm li.active a {
    border-color: #64a531;
    text-decoration: none;
    box-sizing: border-box;
}

#jsddm li.dropdown ul li a:hover {
    border-color: rgba(100, 165, 49, 1);
}

#jsddm > li {
    margin-top: 88px;
}

/*
#jsddm>li:last-child {
  z-index: 1;
  position: relative;
  overflow: hidden;
  width: 170px;
  max-height: inherit !important;
  margin-right: 0px;
  background-color: rgba(100, 165, 49, 1);
  margin-top: 0;
}

#jsddm>li:last-child::after {
  width: 100%;
  left: 0;
  top: 0;
  position: absolute;
  height: 100px;

}

#jsddm>li:last-child a {
  border-color: #64a531;
  background-color: rgba(100, 165, 49, 1);
  color: #fff;
  white-space: nowrap;
  width: 100%;
  display: block;
  z-index: 2;
  position: relative;
  padding: 50px 0 10px 0;
  border-bottom: 20px white solid;
  margin: 0;
  font-size: 18px;
  letter-spacing: 0;
}
*/

.container {
    position: relative;
    clear: both;
}

/*
#telbox {
  width: 170px;
  height: 50px;
  position: absolute;
  margin-top: -33px;
  right: 15px;
  overflow: hidden;
  z-index: 2;
}

#telbox:after {
  content: '';
  position: absolute;
  left: calc(50% - 330px);
  bottom: 0;
  width: 0;
  height: 0;
  bottom: -6px;
  border-left: 0 solid transparent;
  border-right: 50vh solid transparent;
  border-top: 55px solid rgba(100, 165, 49, 1);
}*/

#jsddm li.dropdown ul {
    display: none;
    position: absolute;
    top: 100%;
    z-index: 10;
    width: auto;
    padding-left: 0;
    list-style: none;
}

#jsddm li.dropdown ul li {
    width: 100%;
    margin-left: 0;
}

#jsddm li.dropdown ul li a {
    width: auto
}

.icon {
    width: 50px
}

#jsddm li.dropdown ul li, #jsddm li.dropdown ul li a {
    background-color: #FFF;
    color: #412823;
    border-color: #FFF;
    white-space: nowrap;
}

#jsddm li.dropdown ul li:hover a:hover {
    border-color: #64a531;
}

#jsddm li.dropdown:hover ul {
    display: block
}

#jsddm li.dropdown::after {
    content: url(../img/dropdown.svg);
    height: 16px;
    width: 32px;
    position: absolute;
    top: 15%;
    right: -8px;
}

.phone-xs {
    font-size: 17px
}

#contact-logo {
    max-height: 275px;
}

#pull {
    float: right !important;
    border-left: 0;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    display: none;
    transition: none;
    color: #FFF
}

#pull:before {
    /*content: 'Menu';*/
    text-align: right;
    padding-right: 10px;
    margin-top: 4px
}


#site-header .telephone {
    display: block;
    position: absolute;
    z-index: 10;
    right: 0;
    top: 0;
    width: 170px;
    height: auto;
    background-image: url('/img/phonebox.svg');
    background-repeat: no-repeat;
    background-position: bottom left;

    color: white;
    text-align: center;
    white-space: nowrap;
    padding: 50px 0 30px 0;
    font-size: 20px;
    letter-spacing: 0;
}


#stormschade .container > .col-xs-12 {
    /*background-color: rgba(100, 165, 49, 0.4);*/
    padding-bottom: 20px;
    margin-top: 20px;
    /*opacity: 0.4;*/
}

#bannercontent {
    z-index: 2;
}

#diensten, #diensten > div {
    z-index: 5
}

.bars {
    float: right;
    margin-top: 3px
}

.icon-bar {
    background-color: #000;
    border-radius: 1px;
    display: block;
    height: 2px;
    width: 18px;
    margin-top: 3px
}

#bottom-footer {
    background-color: #452b1c;
    color: #fff;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    float: left;
    width: 100%;
    margin-top: -50px;
}

#bottom-footer a {
    cursor: text;
    color: #FFF;
    text-decoration: none
}

.ppmouse {
    cursor: pointer !important;
}

#content .person:after {
    position: absolute;
    right: 0;
    height: 300px;
    width: 400px;
    content: "";
    background-color: #fff;
    transform: rotate(5deg)
}

#diensten, #facebook, footer {
    /*width: 100%;*/
    /*clear: both;*/
    /*float: left*/
}

#bannercontent {
    color: #fff;
    /*text-shadow: 1px 1px 10px #000;*/
    position: relative;
    height: 100%;
    /*margin-top: -110px;*/
}

#diensten {
    margin-bottom: 70px
}

#diensten img {
    height: 160px;
    object-fit: contain;
}

img.img-center {
    margin: auto
}

#stormschade {
    position: relative;
    height: 700px;
    width: 100vw;
    float: left;
    z-index: 0;
    background-image: url("../img/stormschade.jpg");
    background-size: cover;
    background-position: center center;
}

#stormschade .container {
    color: #FFF;
    margin-top: -540px;
    /*text-shadow: 1px 1px 10px #000; */
}

#stormschade .content {
    position: relative
}

#stormschade-text {
    margin-top: 10%;
    text-shadow: 1px 1px #000;
    color: #FFF
}

.btn-primary {
    border-radius: 0;
    border: 1px solid #FFF;
    background-color: #64a531;
    color: #fff;
    text-shadow: none;
    margin-top: 5px;
    margin-top: 5px;
    padding: 12px 30px;
    letter-spacing: 0px;
}

ul.buttons {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    text-align: center;
}

ul.buttons li {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.buttons a.btn-primary {
    display: inline-block;
}


#stormschade .picture {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    position: relative;
    z-index: -2;
    background-color: rgba(100, 165, 49, 0.5);
}

#stormschade .picture .stormschade-corner-top-left {
    position: absolute;
    top: 0;
    left: 0;
    width: 50vw;
    border-left: 25vw solid #64a531;
    border-right: 25vw solid transparent;
    border-top: 55px solid #fff;
    border-bottom: 55px solid transparent
}

#stormschade .picture .stormschade-corner-top-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 50vw;
    border-left: 25vw solid transparent;
    border-right: 25vw solid #64a531;
    border-top: 55px solid #fff;
    border-bottom: 55px solid transparent
}

#stormschade .picture .stormschade-corner-bottom-right {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50vw;
    border-left: 25vw solid #64a531;
    border-right: 25vw solid transparent;
    border-top: 55px solid transparent;
    border-bottom: 55px solid #fff
}

#stormschade .picture .stormschade-corner-bottom-left {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50vw;
    border-left: 25vw solid transparent;
    border-right: 25vw solid #64a531;
    border-top: 55px solid transparent;
    border-bottom: 55px solid #fff
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    background-color: #507d27 !important;
    border-color: #fff !important
}

.triangle-left, .triangle-right {
    height: 0;
    border-top: 7vh solid transparent;
    border-bottom: 7vh solid transparent;
    top: -5vh;
    width: 0
}

#nieuws {
    margin-top: 25px
}

#nieuws .image {
    position: relative
}

#nieuws .image svg {
    padding: 10px
}

.triangle-left {
    border-right: 49.3vw solid #64a531;
    right: 0;
    position: absolute
}

.triangle-right {
    border-left: 49.3vw solid #f7f9f8;
    left: 0;
    position: absolute
}

#top {
    position: absolute;
    bottom: -25px;
    left: 42vw;
    /*transform: rotate(90deg)*/
}

#top img {
    position: relative;
    /*left: calc(50vw - 125px);*/
    /*top: -10px;*/
    -moz-transform: scaleX(-1) rotate(90deg);
    -o-transform: scaleX(-1) rotate(90deg);
    -webkit-transform: scaleX(-1) rotate(90deg);
    transform: scaleX(-1) rotate(90deg);
    filter: FlipH;
    -ms-filter: "FlipH"
}

footer li {
    padding: 10px 0;
    color: #4c514b;
}

footer li.image {
    display: flex;
    align-items: center;
    z-index: 2;
    position: relative;
}

footer li.image img {
    margin-right: 15px;
    max-height: 38px;
    max-width: 38px
}

footer ul {
    list-style: none;
    padding: 0;
}

footer {
    background-color: #e8f0e5;
}

footer .triangle-right {
    width: 0;
    height: 0;
    border-top: 15vh solid transparent;
    border-left: 49.3vw solid #64a531;
    border-bottom: 15vh solid transparent;
    position: relative;
}

.triangles-top {
    width: 0;
    height: 0;
    border-left: 50vw solid #f7f9f8;
    border-right: 50vw solid #64a531;
    border-top: 50px solid transparent;
    border-bottom: 50px solid #e8f0e5;
    position: relative;
    top: -50px;
    background-color: transparent;
}

.triangles-bottom {
    width: 0;
    height: 0;
    border-right: 50vw solid #f7f9f8;
    border-left: 50vw solid #64a531;
    border-bottom: 50px solid #fff;
    border-top: 50px solid #e8f0e5;
    /*float: left;*/
}

footer .triangles-bottom {
    border-bottom: 150px solid #fff;
    border-top: 130px solid #e8f0e5;
  float: left;
}

.list .row {
    /*display: flex;*/
    flex-wrap: wrap;
    justify-content: center;
}

#facebook {
    margin: 40px 0;
}

.list .row .item {
    margin-bottom: 30px;
    border-radius: 2px;
}

.thumbnailvideo img {
    height: 150px;
}

.row {
    margin-right: 0px;
    margin-left: 0px;
    flex-wrap: wrap;
    display: flex;
}

nav {
    z-index: 1;
    position: relative;
}

.layer {
    position: relative;
}

.thumbnailvideo a:after {
    width: 100%;
    height: 100%;
    content: url(../img/play-video.svg);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    text-align: center;
    vertical-align: middle;
    background-color: rgba(255, 255, 255, 0.3);
    justify-content: center;
    align-items: center;
}

#facebook-content-view-post a {
    width: 310px;
    height: 64px;
    background: #64a531;
    position: relative;
    margin: auto;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

#facebook-content-view-post a:after {
    content: " ";
    width: 0;
    height: 0;
    border-top: calc(65px / 2) solid transparent;
    border-left: 50px solid #64a531;
    border-bottom: calc(65px / 2) solid transparent;
    position: absolute;
    left: 100%;
    top: 0px;
}

.p404 {
    font-size: 20px;
}

#facebook-content-view-post a {
    color: #FFF;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    #facebook .facebook-content-date {
        display: none;
    }
}

#breadcrumbs {
    float: left;
    text-align: left;
    list-style: none;
    padding-left: 0;
    margin-bottom: 20px;

}

#breadcrumbs li {
    float: left;
    padding: 7px 0;
    /*margin: 0 5px;*/
}

#breadcrumbs li a, #breadcrumbs li {
    color: rgb(165, 165, 165);
}

#breadcrumbs li:first-child {
    margin-left: 0px;
}

#breadcrumbs li::before {
    content: "/";
    margin: 0 5px;
}

#breadcrumbs li:first-child a::before {
    content: url('../img/breadcrumbs-home.svg');
    margin-right: 10px;
}

#content .intro p {
    line-height: 28px;
    font-size: 18px;
    font-weight: normal;
}


#content p {
    /*line-height: 28px;*/
    /*font-size: 13px;*/

    line-height: 35px;
    font-size: 16px;
    font-weight: lighter;
}

div.green-area {
    margin-top: 64px;
    margin-bottom: 64px;
    background-color: #e8f0e5;
}

div.green-area .container {
    margin-top: -30px;
    padding-bottom: 20px;

}


#breadcrumbs li:first-child::before {
    content: none;
}

.svgblock {
    float: left;
    width: 100%;
    margin-bottom: 10px;
    margin-top: 40px;
    padding-left: 0px;
    list-style-type: none;
    line-height: 2.5em;
}


.svgblock ul {
    list-style-type: none;
    padding-left: 0px;
}

.svgblock ul li {
    margin-bottom: 8px;
}

.svgblock .svg {
    width: 32px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    margin-right: 14px;
    line-height: 0;
}

#active a {
    display: block;
    color: #FFF;
    background-color: #600;
    width: 9em;
    padding: .2em .8em;
    text-decoration: none;
}

#facebook .facebooklogo {
    min-height: 32px;
    min-width: 32px;
    max-width: 32px;
    width: 100%;
    height: 100%;
    padding-right: 0px;
    padding-left: 0px;
}

.logoarborcare {
    width: 100%;
    float: left;
    margin-bottom: 20px;
    /* position: relative; */
    max-width: 100%;
}

.logoarborcare img {
    /*height: 400px;*/
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    right: 20px;
    bottom: 80px;
}

#breadcrumbs li:last-child {
    color: rgba(100, 165, 49, 1);

}


.manimg {
    position: absolute;
    right: 0px;
    bottom: -45px;
}

.manimg img {
    max-width: 80%;

}

footer {
    margin-top: 50px;
}

.imgtriangle {
    position: absolute;
    right: 0px;
    bottom: -50px;
}

.snoeiwerk {
    bottom: -55px;
}

div.photo {
    padding-top: -22px;
}

#footer-logo {
    z-index: 0;
}

.col-md-3 {
    z-index: 1;
}

.active {
    border-bottom: 1px solid #65a431 !important;
}

#stormschade p {
    color: white;
    padding-bottom: 25px;
    font-size: 16px;
    line-height: 2.0;
}

#facebook h2 {
    font-size: 40px;
}

#facebook .intro {
    color: rgba(100, 165, 49, 1);
    font-size: 16px;
    letter-spacing: 3px;

}

.column {
    display: flex;
    flex-flow: row wrap;
}

.dienstenlink {
    align-self: flex-end;
    width: 100%;
    padding-top: 20px;
    text-decoration: underline;
    font-size: 13px;
}

.dienstentekst {
    width: 100%;
}

.policylinks {
    width: 100%;
}

.small_content {
    background-color: #f7f9f8;
    padding: 32px 64px;
    margin-bottom: 32px;
    text-align: center;
    margin-right: 64px;
}

.small_content:nth-child(2n) {
    margin-right: 0;
    margin-left: 64px;
}


.container.container-grid{
  display: flex;
}
@media (max-width: 768px) {

  .container.container-grid{
    display: block;
  }
}

.grey{
  background-color: #f7f9f8;
  padding: 16px;
  border: 10px white solid;
}