#white,
body,
html {
    background-color: #fff
}

h1,
h3 {
    color: #015159
}

body,
html {
    height: 101%
}

.fb-page,
.fb-page span,
.fb-page span iframe[style] {
    width: 100%!important
}

@media screen and (min-width:40em) {
    .mediumpaddingrightleft {
        padding-right: 2rem;
        padding-left: 2rem
    }
}

@media screen and (max-width:39.9375em) {
    .containersmall {
        padding-right: 0;
        padding-left: 0
    }
}

@media screen and (max-width:63.9375em) {
    #mainbackground {
        background-color: #fff;
        padding-left: 0;
        padding-right: 0
    }
    #whitefield {
        background-color: #fff
    }
}

@media screen and (min-width:64em) {
    #mainbackground {
        background: url(https://www.sidestone.com/images/Boekenkastdark.jpg) top left fixed #fff;
        background-size: 100%;
        height: 100%;
        width: 100%;
        padding-top: 2rem;
        padding-left: 0;
        padding-right: 0
    }
    #whitefield {
        background-color: #fff;
        padding-top: .9375rem;
        margin-bottom: 2rem;
        box-shadow: 0 0 40px rgba(0, 0, 0, .8)
    }
}

#header {
    background: url(https://www.sidestone.com/images/1200.jpg) no-repeat;
    background-size: contain;
    height: 0;
    padding-top: 12%
}

#mobilebar {
    background-color: #dd780f;
    height: 3.3rem
}

#mobileheader {
    background: url(https://www.sidestone.com/images/1200.jpg) no-repeat;
    background-size: 100%;
    height: 0;
    padding-top: 15.59%;
    margin-left: 5px;
}

#container {
    padding-left: 0;
    padding-right: 0
}

.container {
    padding-left: 0;
    padding-right: 0
}

.panel {
    background: 0 0;
    border-style: dotted
}

blockquote,
li,
p {
    font-size: 90%
}

h1 {
    font-size: 1.6rem;
    font-family: "trebuchet ms"
}

h2 {
    font-size: .9rem;
    font-weight: 700
}

h3 {
    font-size: 1.1rem
}

A,
A.class1,
A.class1:link,
A:hover {
    color: #000
}

A:active,
A:link,
A:visited {
    text-decoration: underline;
    color: #000
}

A:hover {
    text-decoration: none
}

A.class1:link {
    text-decoration: underline
}

A.class1:hover,
A.class1:visited {
    text-decoration: none;
    color: grey
}

A.class1:active {
    text-decoration: underline;
    color: grey
}

A.class2 {
    color: #000
}

A.class2:link {
    text-decoration: none;
    color: #000
}

A.class2:visited {
    text-decoration: none;
    color: grey
}

A.class2:hover {
    text-decoration: underline;
    color: grey
}

A.class2:active,
A.class4:hover,
A.class4:link,
A.class4:visited {
    text-decoration: none
}

A.class2:active {
    color: grey
}

A.class3 {
    color: #000
}

A.class3:active,
A.class3:hover,
A.class3:link,
A.class3:visited {
    text-decoration: none;
    color: #000;
    font-weight: 700
}

A.class4,
A.class4:link {
    color: #015159
}

A.class4:visited {
    color: grey
}

A.class4:hover {
    color: #fff
}

A.class4:active {
    text-decoration: underline;
    color: grey
}

A.title {
    color: #015159
}

A.title:link,
A.title:visited {
    text-decoration: none;
    color: #015159
}

A.title:active,
A.title:hover {
    text-decoration: underline;
    color: #015159
}

A.secondary.label {
    color: #fff
}

A.secondary.label:active,
A.secondary.label:hover,
A.secondary.label:link,
A.secondary.label:visited {
    text-decoration: none;
    color: #fff
}

A.blacklabel {
    color: #000
}

A.blacklabel:active,
A.blacklabel:hover,
A.blacklabel:link,
A.blacklabel:visited {
    text-decoration: none;
    color: #000
}

A.whitelabel {
    color: #fff
}

A.whitelabel:active,
A.whitelabel:hover,
A.whitelabel:link,
A.whitelabel:visited {
    text-decoration: none;
    color: #fff
}

.button.dropside::after {
    content: '';
    width: 0;
    height: 0;
    border: .4em solid;
    border-color: transparent transparent transparent #fefefe;
    border-width: .4em 0 .4em .8em;
    position: relative;
    top: .2em;
    float: right;
    margin-left: 1em;
    display: inline-block
}

.coveronof img {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    border: 0;
}

.coveronof:hover img {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0;
    border: 0;
}

.backbutton img {
    filter: alpha(opacity=60);
    -moz-opacity: .6;
    opacity: .6
}

.backbutton:hover img {
    filter: alpha(opacity=90);
    -moz-opacity: .9;
    opacity: .9
}

.appbutton img {
    filter: alpha(opacity=30);
    -moz-opacity: .3;
    opacity: .3
}

.appbutton:hover img {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1
}

.buybutton img {
    filter: alpha(opacity=90);
    -moz-opacity: .9;
    opacity: .9
}

.buybutton:hover img {
    filter: alpha(opacity=60);
    -moz-opacity: .6;
    opacity: .6
}

.btn--primary,
.shadow {
    -moz-box-shadow: 3px 3px 4px #A0A0A0;
    -webkit-box-shadow: 3px 3px 4px #A0A0A0;
    box-shadow: 3px 3px 4px #A0A0A0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#A0A0A0')";
    filter: progid: DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#A0A0A0')
}

.shadowround {
    -moz-box-shadow: 3px 3px 4px #A0A0A0;
    -webkit-box-shadow: 3px 3px 4px #A0A0A0;
    box-shadow: 3px 3px 4px #A0A0A0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#A0A0A0')";
    filter: progid: DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#A0A0A0');
    border-radius: 12px;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px
}

.zemdiv {
    background-color: #7f9fa2
}




/*

HIER ONDER KLOOIEN

*/




body {
  font-family: "Heebo", Helvetica, Roboto, Arial, sans-serif;
  font-weight: normal;
  font-size: 1rem;
  line-height: 1.5;
  color: #0a0a0a; }


h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  font-family: 'Barlow', Helvetica, Roboto, Arial, sans-serif;
  font-style: normal;
  font-weight: 300;
  color: inherit;
  text-rendering: optimizeLegibility; }
  h1 small, .h1 small,
  h2 small, .h2 small,
  h3 small, .h3 small,
  h4 small, .h4 small,
  h5 small, .h5 small,
  h6 small, .h6 small {
    line-height: 0;
    color: #cacaca; }


h1, .h1 {
  font-family: 'Barlow';
  font-weight: 900;
  font-size: 1.5rem;
  color: #015159;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 0.5rem;
  text-transform: uppercase; }

h2, .h2 {
  font-family: 'Barlow';
  font-weight: 500;
  font-size: 1.00rem;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 0.5rem; }

h3, .h3 {
  font-family: 'Barlow';
  font-weight: 500;
  font-size: 1.15rem;
  color: #015159;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 0.5rem; }


.accordion-title {
  font-size: .75rem;
  background-color: #023440;
    font-family: "Barlow";
    font-weight: 500;
}
  .accordion-title:hover, .accordion-title:focus {
    background-color: #006666; }


.onetree {
    font-family: "Barlow";
    font-weight: 500;
    color: #dd780f;
    font-size: 1rem; }


.treelink {
        color: #dd780f; }

A.treelink {
    color: #dd780f
}

A.treelink:link,
A.treelink:visited {
    text-decoration: none;
    color: #dd780f
}

A.treelink:active,
A.treelink:hover {
    text-decoration: underline;
    color: #dd780f
}


.headeritem {
    font-family: "Barlow";
    font-weight: 900;
    font-size: .9rem;
    color: #023440;
    text-transform: uppercase; }

.headersubitem {
    font-family: "Barlow";
    font-weight: 500;
    color: #023440;
    font-size: .8rem; }

.pubitem {
    font-family: "Barlow";
    font-weight: 500;
    font-size: 0.8rem;
    text-transform: uppercase; }


.mobileitem {
    font-family: "Barlow";
    font-weight: 500;
    color: #fff;
    font-size: .8rem;
    text-transform: uppercase; }

.breadcrumbs li {
    font-family: "Barlow";
    font-weight: 300; 
    color: #023440;
    font-size: .8rem;}

a.pubitem,
a.headeritem,
a.headersubitem,
a.bredcrumbs {
    color: #023440;}

.button {
  background-color: #0099a3;
}

.button.success {
    background-color: #cc6600;
    color: #fefefe; }
  .button.success:hover, .button.success:focus {
      background-color: #663300;
      color: #fefefe; }

.button:hover, .button:focus {
    background-color: #015159;
    color: #fefefe; }   

.button.hollow.box {
    border: 1px solid #0099a3;
    color: #0099a3; }

.pagination .current {
    background: #0099a3;
  }

