/*** Algemeen ***/
@font-face {
    font-family: Kindergarten;
    src: url("images/Kinderg.ttf");
}

@font-face {
    font-family: Unicorn NF;
    src: url("images/UNICORN.TTF");
}

body {
    /*background-color: gray;
    background-repeat: repeat;
    background-size: 120%;*/
    font-family: 'Calibri';
    background-size: 100%;
    background: url('images/bg7.jpg') repeat scroll center top #87827F;
}

.bg-logo {
    /*position: fixed;
    top: 0px;
    left: 0px;
    z-index: -1;*/
}

.indextr {
    position:fixed;
    top: 50%;
    margin-top: -385px;
    left: 50%;
    margin-left: -565px;
    white-space: nowrap;
}

.index .row1 {
    height: 370px;
}

.index .row2 {
    height: 370px;
}

.home_button {
    float: right;
    margin: 10px 30px 10px 15px;
    padding: 5px 30px 5px 30px;
    background-color: #616161;
    border:  2px solid;
}
.dp_button {
    float: left;
    margin: 10px 15px 10px 30px;
    padding: 5px 30px 5px 30px;
    background-color: #616161;
    border:  2px solid;
}

.button:hover {
    cursor: pointer;
    -webkit-filter: brightness(50%);
}

table {
    border-collapse: collapse;
    table-layout: fixed;
}

.linktable td:hover {
    cursor: pointer;
    -webkit-filter: sepia(0.4);
}

.menu td {
    #width: 430px;
    #height: 450px;
    border: 5px solid white;
    font-size: xx-large;
    font-weight: 900;
    color: #FFF;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
    vertical-align: bottom;
    text-align: center;
}

.menuot td {
    width: 1100px;
    min-width: 1100px;
    height: 300px;
    border: 5px solid white;
    font-size: xx-large;
    font-weight: 900;
    color: #FFF;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
    vertical-align: bottom;
    text-align: center;
}

.menudp td {
    width: 200px;
    min-width: 200px;
    height: 250px;
    border: 5px solid white;
    font-size: xx-large;
    font-weight: 900;
    color: #FFF;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
    vertical-align: bottom;
    text-align: center;
}

.wie td {
    #width: 430px;
    #height: 450px;
    #border: 5px solid white;
    font-size: x-large;
    color: #FFF;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
    #vertical-align: bottom;
    text-align: center;
}

.sidemenu ul {
    position: fixed;
    top: 50%;
    margin-top: -481px;
    right: 0px;
}

.sidemenu a:link {
    text-decoration: none;
}
.sidemenu a:visited{
    text-decoration: none;
}
.sidemenu a:hover{
    #text-decoration: underline overline;
    color: #88B56D;
}

.sidemenu ul li {
    list-style-image: url('images/list_open.gif');
}

.sidemenu ul li:hover {
    list-style-image: url('images/list_closed.gif');
}

.sidemenu ul li {
    margin: 15px;
    /*display: list-item;
    font-size: x-large;
    font-weight: 900;
    color: white;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;*/
}

.sidemenu li a {
    font-size: xx-large;
    font-weight: 900;
    color: #CEE8BE;
    text-shadow: -2px 0 black, 0 2px black, 2px 0 black, 0 -2px black;
    text-underline: none;
}

.index #td1 {
    width: 250px;
    min-width: 250px;
    background-repeat: no-repeat;
    background-position: -77px -65px;
    background-size: 133%;

    #-webkit-filter: brightness(80%);
}

.index #td2 {
    width: 450px;
    min-width: 450px;
    background-repeat: no-repeat;
    background-position: 0px -119px;
    background-size: 100%;
    color: #FFFFFF;
    #-webkit-filter: brightness(80%);
}

.index #td3 {
    width: 250px;
    min-width: 250px;
    background-repeat: no-repeat;
    background-position: -20px -130px;
    background-size: 140%;
}

.index #td4 {
    width: 250px;
    min-width: 250px;
    background-repeat: no-repeat;
    background-position: -12px 0px;
    background-size: 106%;
}

.vergoedingen td {
    background-repeat: no-repeat;
    background-position: 0px -257px;
    background-size: 100%;
}

#pagetext {
    padding-top: 20px;
    padding-left: 10px;
    font-size: x-large;
    font-weight: 700;
    color: white;
    background-color: #66615D;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    #text-shadow: 0px 0 white, 0 0px white, 0px 0 white, 0 0px white;
    #vertical-align: bottom;
    text-align: left;
    vertical-align: top;
    font-family: "Calibri";
}

#maps {
    text-shadow: 0px 0 white, 0 0px white, 0px 0 white, 0 0px white;
    background-color: #E9E5DC;
}

.hoog-sensitiviteit td {
    background-repeat: no-repeat;
    background-position: 0px -150px;
    background-size: 100%;
}

.verslavings td {
    background-repeat: no-repeat;
    background-position: 0px -300px;
    background-size: 100%;
}

.ontwikkeling td {
    background-repeat: no-repeat;
    background-position: 0px -650px;
    background-size: 100%;
}

.burnout td {
    background-repeat: no-repeat;
    background-position: 0px -150px;
    background-size: 100%;
}
.seksueelmisbruik td {
    background-repeat: no-repeat;
    background-position: 0px -150px;
    background-size: 100%;
}

.online-therapie td {
    background-repeat: no-repeat;
    background-color: black;
    background-position: -50px -165px;
    background-size: 100%;
}

.styling td {
     background-repeat: no-repeat;
     background-position: -52px -232px;
     background-size: 105%;
 }

.contact td {
    background-repeat: no-repeat;
    background-position: 0px -151px;
    background-size: 100%;
}

.reacties td {
    background-repeat: no-repeat;
    background-position: 0px -209px;
    background-size: 100%;
}

.wie #tdwie {
    #border: 5px solid white;
    padding: 20px;
    background-color: #ada8a4;
    #vertical-align: bottom;
    #text-align: center;
}

.disclaimer td {
    font-size: xx-large;
    font-weight: 900;
    background-repeat: no-repeat;
    background-position: 0px -173px;
    background-size: 100%;
}

.relatie td {
    font-size: xx-large;
    font-weight: 900;
    background-repeat: no-repeat;
    background-position: 0px -224px;
    background-size: 100%;
}

.menuot #td1 {
    font-size: xx-large;
    font-weight: 900;
    background-repeat: no-repeat;
    background-position: -110px -175px;
    background-size: 100%;
}

.menuot #td2 {
    font-size: xx-large;
    font-weight: 900;
    background-repeat: no-repeat;
    background-position: 0px -1150px;
    background-size: 100%;
}

.menuot #td3 {
    font-size: xx-large;
    font-weight: 900;
    background-repeat: no-repeat;
    background-position: 0px -103px;
    background-size: 100%;
}
.route td {
    background-position: 0px -161px;
    background-size: 100%;
}

.menudp #td1 {
    background-repeat: no-repeat;
    background-position: -89px -50px;
    background-size: 265%;
}

.menudp #td2 {
    background-repeat: no-repeat;
    background-position: -80px 0px;
    background-size: 200%;
}

.menudp #td3 {
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 100%;
}

.menudp #td4 {
    background-repeat: no-repeat;
    background-position: -140px 0px;
    background-size: 200%;
}

.menudp #td5 {
    background-repeat: no-repeat;
    background-position: -108px 0px;
    background-size: 209%;
}

.form_contact {
    text-align: center;
}

.form_contact p input {
    width: 250px;
}

@media only screen and (max-height: 981px) {
    .sidemenu ul {
        position: fixed;
        top: 0%;
        margin-top: 10px;
        display: inline-block;
    }
}

@media only screen and (max-width: 1700px) {
    .sidemenu {
        vertical-align: top;
    }

    .sidemenu ul {
        position: relative;
        vertical-align: top;
        display: inline-block;
        margin-left: 20px;
    }
}

.indextr td:first-child {
    width: auto;
}

.indextr .sidemenu ul {
    position: relative;
}

@media only screen and (max-width: 1150px) {
    .indextr{
        position: relative;
        left: 0%;
        margin-left: 20px;
    }
}

@media only screen and (max-height: 750px) {
    .indextr{
        position: relative;
        top: 0%;
        margin-top: 20px;
    }
    .indextr .sidemenu ul {
        display: inherit;
    }
}

@media only screen and (min-height: 981px) {
    .sidemenu ul {
        top: 0% !important;
        margin-top: 10px !important;
    }
}