@charset "utf-8";
/**
 * SenCSS - Sensible Standards CSS framework
 *
 * Copyright (c) 2008-2009 Kilian Valkhof (kilianvalkhof.com)
 * Visit sencss.kilianvalkhof.com for more information and changelogs.
 * Licensed under the MIT license. http://www.opensource.org/licenses/mit-license.php
 *
 */
 * { -moz-box-sizing:border-box;box-sizing:border-box;}
html,body,div,span,object,iframe,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,var,fieldset,form,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video{vertical-align:baseline;margin:0;padding:0}
article,aside,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video {display:block}
body{background:#fff;color:#000;font:100%/1.5em Lato, Helvetica, Arial, "DejaVu Sans", "Liberation sans", "Bitstream Vera Sans", sans-serif;position:relative}
textarea{font:101%/1.5em Lato, Helvetica, Arial, "DejaVu Sans", "Liberation sans", "Bitstream Vera Sans", sans-serif;border:1px solid #ccc;border-bottom-color:#eee;border-right-color:#eee;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;width:100%;margin:0;padding:.29em 0}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
:focus{outline:none}
a{text-decoration:underline;border:0}
a:hover,a:focus{text-decoration:none}
a img{border:0}
abbr,acronym{border-bottom:1px dotted;cursor:help;font-variant:small-caps}
address,cite,em,i{font-style:italic}
blockquote p{margin:0 1.5em 1.5em;padding:.75em}
code,kbd,tt{font-family:"Courier New", Courier, monospace, serif;line-height:1.5}
del{text-decoration:line-through}
dfn{border-bottom:1px dashed;font-style:italic}
dl{margin:0 0 1.5em}
dd{margin-left:1.5em}
h1,h2,h3,h4,h5,h6{font-weight:700;padding:0;color:#414142;}
h1{font-size:2em;margin:0 0 .75em}
h2{font-size:2.2199em;margin:.2em 0 1em;line-height: 1.4em;font-weight:500;}
h3{font-size:1em;margin:0 0 1.286em;color:  #c31b77;}
h4{font-size:1em;margin:0 0 1.5em}
h5{font-size:.8333em;margin:0 0 1.8em}
h6{font-size:.666em;margin:0 0 2.25em}
img{display:inline-block;vertical-align:text-bottom}
ins{text-decoration:overline}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}
ol{list-style:outside decimal}
p{font-weight:300;margin:0 0 1.5em;color:#404041;}
pre{font-family:"Courier New", Courier, monospace, serif;margin:0 0 1.5em}
sub{top:.4em;font-size:.85em;line-height:1;position:relative;vertical-align:baseline}
sup{font-size:.85em;line-height:1;position:relative;bottom:.5em;vertical-align:baseline}
ul{list-style:outside disc}
ul,ol{margin:0 0 1.5em 1.5em;padding:0}
li ul,li ol{margin:0 0 1.5em 1.5em;padding:0}
table{border-collapse:collapse;border-spacing:0;margin:0 0 1.5em;padding:0}
caption{font-style:italic;text-align:left}
tr.alt td{background:#eee}
td{border:1px solid #000;vertical-align:middle;padding:.333em}
th{font-weight:700;vertical-align:middle;padding:.333em}
button{cursor:pointer;display:block;font-size:1em;height:2em;line-height:1.5em;margin:1.75em 0 0;padding:0 .5em}
button::-moz-focus-inner{border:0}
fieldset{border:0;position:relative;margin:0 0 1.5em;padding:1.5em 0 0}
fieldset fieldset{clear:both;margin:0 0 1.5em;padding:0 0 0 1.5em}
input{border:1px solid #ccc;border-bottom-color:#eee;border-right-color:#eee;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;font-size:12px;height:1.5em;line-height:1.5em;width:100%;margin:0 0 .75em;padding:.29em 0}
input[type=file]{height:2.25em;padding:0}
select{border:1px solid #ccc;border-bottom-color:#eee;border-right-color:#eee;font-size:1em;height:2.25em;_margin:0 0 1.3em;margin:0 0 .8em;padding:.2em 0 0}
optgroup{font-weight:700;font-style:normal;text-indent:.2em}
optgroup + optgroup{margin-top:1em}
option{font-size:1em;height:1.5em;text-indent:1em;padding:0}
label{cursor:pointer;display:block;height:auto;line-height:1.4em;width:100%;margin:0;padding:0}
label input{background:0;border:0;height:1.5em;line-height:1.5em;width:auto;margin:0 .5em 0 0;padding:0;vertical-align: middle;margin-lefT:5px;}
legend{font-size:1.1666em;font-weight:700;left:0;margin:0;padding:0}
dt,strong,b{font-weight:700}
.amp{font-family:Baskerville, "Goudy Old Style", Palatino, "Book Antiqua", "URW Chancery L", Gentium, serif;font-style:italic}
.quo{font-family:Georgia, Gentium, "Times New Roman", Times, serif}
.lquo{font-family:Georgia, Gentium, "Times New Roman", Times, serif;margin:0 0 0 -.55em}
.introParagraphArticle:first-letter{float:left;font-size:3.2em;font-weight:700;line-height:1em;margin:0 0 -.2em;padding:.125em .1em 0 0}
.message{background:#eee;border:1px solid #999;margin:1.5em;padding:.666em}
.error{background:#fee;border:1px solid red;margin:1.5em;padding:.666em}
.notice{background:#eef;border:1px solid #00f;margin:1.5em;padding:.666em}
.success{background:#efe;border:1px solid #0f0;margin:1.5em;padding:.666em}
.warning{background:#ffe;border:1px solid #ff0;margin:1.5em;padding:.666em}
.aside-left{clear:left;float:left;overflow:hidden;margin:0 1.5em 1.5em 0}
.aside-right{clear:right;float:right;overflow:hidden;margin:0 0 1.5em 1.5em}
.horizontalForm button{clear:left;float:left;margin:.25em 0 0}
.horizontalForm input,.horizontalForm textarea{float:left;width:49%;margin:0 0 .8em}
.horizontalForm select{float:left;_margin:0 0 1.25em;margin:0 0 .75em}
.horizontalForm label{clear:left;float:left;width:49%;padding:.375em 0}
.horizontalForm label input{height:1em;line-height:1.5em;width:auto;margin:.25em .5em 0 0}
.horizontalForm label.singleLine{clear:both;float:none;height:1.5em;width:100%;padding:0}
.plugin_picture {
  max-width:100%;
  margin-bottom:1.5em;
  margin-right:15px;
  display:inline;
}
  .plugin_picture img{max-width:100%;}
  .plugin_picture.align-right {float:right;margin-right:0;margin-left:1.5em;}
  .plugin_picture.align-left {float:left;margin-right:1.5em;margin-left:0;}
  .plugin_picture.align-center {display:block;width:100%;text-align:center;float:none;margin-right:0;}

.errorlist {
    display:block;
    font-weight:bold;
    list-style:none;
    margin:0 0 0;
    padding:3px 0;
    width:100%;
    line-height:16px;
  }
/* slideshow */
.slideshow {
    height:375px;
    overflow: hidden;
    position: relative;
    max-width: 500px;
    width:100%;
    z-index: 1;
}

.inner {
    width:950px;
    margin:auto;
    position:relative;
}

span.fairpup {
    text-transform:uppercase;
}


/*base*/
html {
    height:100%;
}
body {
    min-height:100%;
}
#wrap {
    height:100%;
    padding-bottom: 224px;
}
header {
    width:2250px;
    position:absolute;
    top:0;
    left:-2000px;
    padding-top:20px;
}
    header h1 {
        height:auto;
        margin-bottom: 36px;
        text-indent:-99999em;
        overflow: hidden;
    }
        header h1 a {
            background:url('../img/logo.png')no-repeat;
            height: 207px;
            width: 167px;
            display:block;
            float:right;
            margin-right: 20px;
            -webkit-transform:rotateY(0deg) ;
            -moz-transform:rotateY(0deg) ;
            -ms-transform:rotateY(0deg) ;
            -o-transform:rotateY(0deg) ;
            transform:rotateY(0deg) ;
            -webkit-transition: .6s all;
            -moz-transition: .6s all;
            -ms-transition: .6s all;
            -o-transition: .6s all;
            transition: .6s all;
        }

header nav {display:block;position:relative;}
header nav ul{list-style:none;width:2250px;margin:0;padding:0;}
header nav ul li{position:relative;}
    header nav ul li a {
        height: 55px;
        display: block;
        padding: 16px 26px 16px 16px;
        text-align: right;
        color:#fff;
        text-transform:uppercase;
        text-decoration: none;
        background:black;
        background: -webkit-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
        background: -moz-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
        background: -o-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
        background: -ms-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
        background: linear-gradient(0deg, #2d2d2e 0%, #6d6d6d 100%);
    }

    header nav ul li a:hover,header nav ul li.selected a {
        background:pink;
        background: -webkit-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -moz-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -o-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -ms-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: linear-gradient(0deg, #890052 0%, #c30075 100%);
    }
        header nav ul li:nth-child(odd) a:after {
            position:absolute;
            display:block;
            content: '';
            top: 14px;
            right:-20px;
            height:27px;
            width:29px;
            background:url('../img/paw.png')no-repeat center;
            -webkit-transform: rotate(18deg);
            -moz-transform: rotate(18deg);
            -ms-transform: rotate(18deg);
            -o-transform: rotate(18deg);
            transform: rotate(18deg);
        }
        header nav ul li:nth-child(even) a:after {
            position:absolute;
            display:block;
            content: '';
            top: 14px;
            right:-22px;
            height:27px;
            width:29px;
            background:url('../img/paw.png')no-repeat center;
            -webkit-transform: rotate(5deg);
            -moz-transform: rotate(5deg);
            -ms-transform: rotate(5deg);
            -o-transform: rotate(5deg);
            transform: rotate(5deg);
        }
        header nav ul li a:hover:after, header nav ul li.selected a:after {
            background:url('../img/paw-hover.png')no-repeat center;
            -webkit-transform: rotate(0deg);
            -moz-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            -o-transform: rotate(0deg);
            transform: rotate(0deg);
        }
#side-menu:after {
    display:block;
    height:330px;
    position:absolute;
    right:250px;
    top:0px;
    width:485px;
    height:330px;
    content: '';
/*background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.5) 75%, rgba(255,255,255,0) 100%); *//* FF3.6+ */
/*background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(255,255,255,0.75)), color-stop(75%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); *//* Chrome,Safari4+ */
/*background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.75) 50%,rgba(255,255,255,0.5) 75%,rgba(255,255,255,0) 100%); *//* Chrome10+,Safari5.1+ */
/*background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.75) 50%,rgba(255,255,255,0.5) 75%,rgba(255,255,255,0) 100%); *//* Opera 11.10+ */
/*background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.75) 50%,rgba(255,255,255,0.5) 75%,rgba(255,255,255,0) 100%); *//* IE10+ */
/*background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.75) 50%,rgba(255,255,255,0.5) 75%,rgba(255,255,255,0) 100%); *//* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); *//* IE6-9 */
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 63%, rgba(255,255,255,0.75) 75%, rgba(255,255,255,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(63%,rgba(255,255,255,1)), color-stop(75%,rgba(255,255,255,0.75)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 63%,rgba(255,255,255,0.75) 75%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 63%,rgba(255,255,255,0.75) 75%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 63%,rgba(255,255,255,0.75) 75%,rgba(255,255,255,0) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 63%,rgba(255,255,255,0.75) 75%,rgba(255,255,255,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */

}
    .plugin_video {
        width:100%;
    }
        .plugin_video object {
            width:100%;
        }
    #toggle-menu {
        position:absolute;
        display:block;
        width:auto;
        height: 30px;
        width: 120px;
        text-decoration:none;
        padding-top: 2px;
        top: 20px;
        left: 20px;
        opacity:1;
    }
    #toggle-menu:after {
        display: block;
        color:#c30075;
        height: 100%;
        width: 100%;
        padding-left: 35px;
        background: url('../img/paw.png')no-repeat left 0px top 0px;
        content: 'Open menu';
        -webkit-transition-delay: .6s all;
        -moz-transition-delay: .6s all;
        -ms-transition-delay: .6s all;
        -o-transition-delay: .6s all;
        transition-delay: .6s all;
        -webkit-transition: .6s all;
        -moz-transition: .6s all;
        -ms-transition: .6s all;
        -o-transition: .6s all;
        transition: .6s all;
    }
    .mm-opened #toggle-menu:after {
        background: url('../img/paw-hover.png')no-repeat left top;
        color:#404041;
        content: '';
        background-position-x: 6px;
        -webkit-transition-delay: .6s all;
        -moz-transition-delay: .6s all;
        -ms-transition-delay: .6s all;
        -o-transition-delay: .6s all;
        transition-delay: .6s all;
    }
    .header-pups {
        float:right;
        margin-top:25px;
        height: 150px;
    }
#main {
    padding-left: 250px;
    padding-top: 170px;
    min-height: 763px;
}

    #content {
        margin-left: 80px;
        overflow:hidden;
    }
    #content .page-title {
        text-transform:uppercase;
        color:  #414142;
    }


footer {
    position:absolute;
    bottom:0;
    background:#c30075;
    width:100%;
    padding-bottom:54px;
}
    .initiative {
        background:#fff;
        text-align:right;
        line-height: 3.125em;
        padding-bottom: 1em;
    }

        .initiative a {
            position: relative;
            overflow: hidden;
            background: url('../img/initiatives.jpg') no-repeat;
            display: inline-block;
            width: 85px;
            margin-left: 1em;
            text-align: left;
            text-indent: -9999px;
            vertical-align: top;
        }

        .initiative .hondenbescherming{

        }
        .initiative .CBF{
            background-position: -100px 0;
            width: 35px;

        }

    .copyright {
        color:#fff;
        overflow:hidden;
    }
        .copyright .inner {
            overflow:hidden;
        }
        .copyright span{
            float:left;
            clear:both;
            margin-top:10px;
            margin-bottom:14px;
        }
        .copyright .inner a img {
            -webkit-transform:rotateY(0deg) ;
            -moz-transform:rotateY(0deg) ;
            -ms-transform:rotateY(0deg) ;
            -o-transform:rotateY(0deg) ;
            transform:rotateY(0deg) ;
            -webkit-transition: .6s all;
            -moz-transition: .6s all;
            -ms-transition: .6s all;
            -o-transition: .6s all;
            transition: .6s all;
        }
    footer .fb {
        width:33px;
        height:33px;
        display:block;
        float:left;
        clear:left;
        margin-top: 20px;
    }
    footer .twitter {
        width:33px;
        height:33px;
        display:block;
        float:left;
        margin-left:10px;
        margin-top: 20px;
    }

/*page-default*/
.textblock a {
    margin-left:115px;
    background: -webkit-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -moz-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -o-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -ms-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: linear-gradient(0deg, #2d2d2e 0%, #6d6d6d 100%);
    border-radius: 10px;
    display:inline-block;
    width:auto;
    margin-bottom:10px;
    color:#fff;
    text-decoration: none;
    height:32px;
    padding: 3px 30px;
    position:relative;
    float: right;
    clear: both;
}
    .textblock a:hover {color:#ffeeee;}
    .textblock a:after {
        background: url('../img/tennisball.png')no-repeat;
        width: 124px;
        content: '';
        height: 34px;
        position: absolute;
        top: -2px;
        left: -111px;
        /*background-position:-125px 0px;transition value*/
        /*opacity:0;transition value*/
        transition:all .3s;
    }
    .textblock p>a,
    .textblock p span.plugin_file a {
        background:none;
        margin:0;
        padding:0;
        color:#E52297;
        text-decoration:underline;
        display:inline-block;
        margin-left: 5px;
        width: auto;
        float: none;
        clear: none;
        font-weight: 600;
    }
        .textblock p>a:hover,
    .textblock p span.plugin_file a:hover {
            text-decoration:none;
            color:#E52297;
        }

        .textblock p>a:after,
    .textblock p span.plugin_file a:after {content:'';background:none;margin:0;padding:0;position: relative;height: 0;width: 0;}

    /*.textblock a:hover:after {*/
    /*background-position:0px 0px;*/
    /*opacity:1;*/
/*}*/


.readmore {
    margin-left:115px;
    background: -webkit-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -moz-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -o-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: -ms-linear-gradient(90deg, #2d2d2e 0%, #6d6d6d 100%);
    background: linear-gradient(0deg, #2d2d2e 0%, #6d6d6d 100%);
    border-radius: 10px;
    display:inline-block;
    width:auto;
    margin-bottom:10px;
    color:#fff;
    text-decoration: none;
    height:32px;
    padding: 3px 30px;
    position:relative;
}
    .readmore:hover {
        text-decoration:underline;
    }
    .readmore:after {
        background: url('../img/tennisball.png')no-repeat;
        width: 124px;
        content: '';
        height: 34px;
        position: absolute;
        top: -2px;
        left: -111px;
        /*background-position:-125px 0px;transition value*/
        /*opacity:0;transition value*/
        transition:all .3s;
    }
    /*.readmore:hover:after {*/
        /*background-position:0px 0px;*/
        /*opacity:1;*/
    /*}*/
    .ongeschikt + .readmore {
        float:right;
    }

.ongeschikt {
    background:#404041;
    border-radius:15px;
    padding:20px 36px 50px 36px;
    position:relative;
    margin-bottom:50px;
}
    .ongeschikt h4 {
        color:#fff;
        margin-bottom:20px;
        text-align:center;
        display:block;
    }
    .ongeschikt p {
        color:#fff;
        text-align:center;
        display:block;
    }

    .ongeschikt .answer {
        color:#fff;
        text-decoration:none;
        text-align:center;
        border-radius:10px;
        font-weight:700;
        border:none;
        width: 135px;
        height: 55px;
        padding:16px;
        background:pink;
        background: -webkit-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -moz-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -o-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -ms-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: linear-gradient(0deg, #890052 0%, #c30075 100%);
        display:inline-block;
        margin-left:90px;
        margin-bottom:20px;
    }
    .ongeschikt .answer:first-child {
        margin-left:100px;
    }
    .ongeschikt .loading {
        display: inline-block;
        vertical-align:middle;
        border-radius: 10px;
        width: 503px;
        height: 35px;
        margin:auto;
        background:#fff;
        overflow:hidden;
    }
    .ongeschikt .load-bar {
        width:80%;
        height:40px;
        display:block;
        border-radius:10px;
        background: -webkit-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -moz-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -o-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -ms-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: linear-gradient(0deg, #890052 0%, #c30075 100%);
    }
        .status {
            display:inline-block;
            vertical-align:middle;
            color:#fff;
            margin-left: 2px;
        }
    .ongeschikt .bones {
        display:block;
        position:absolute;
        bottom:-20px;
        left:0;
        width: 620px;
        margin-left:50%;
        left:-290px;
        height:40px;
    }
    .ongeschikt .bones .bone:first-child {
        margin:0;
    }
    .ongeschikt .bones .bone:last-child {

    }
    .ongeschikt .bones .bone {
        float:left;
        display:block;
        margin-left: 16.2%;
        background:url('../img/bone.png');
        width:35px;
        height:40px;
    }

/*page-quiz    */
#quiz {
    color:#fff;
    overflow:hidden;
}

.quiz-readmore {
    float: right;
    clear: both;
    width: 250px;
}

.guideline-excerpt {
    position: absolute;
}

#result #bar , #progress-bar {
  height:50px;
  width:100%;
  border-radius: 5px;
  overflow:hidden;
  background:#999;
  position:relative;
}
#result #bar #bar_inner , #progress-bar .inner-progress-bar {
  background: #E52297;
  width:0%;
  border-radius:5px;
  box-shadow: 0px 9px 0px #c30075;
  line-height:50px;
  height:50px;
  font-size:20px;
  font-weight:bold;
  text-align:center;
  position:relative;
  top:-9px;
}
#progress-bar {height:25px;}
.inner-progress-bar {
    width:0%;
    -webkit-transition: .3s all;
    -moz-transition: .3s all;
    -ms-transition: .3s all;
    -o-transition: .3s all;
    transition: .3s all;}
#progress-bar span {text-align:center;margin:0;position: relative;margin-top: -50px;}
#result #bar #bar_inner.empty {
  top:0;
  background:transparent;
  box-shadow:0 0 0;
}
  #bar_inner span{
    opacity:0;
    width:548px;
      padding-top: 5px;
      -webkit-transition: opacity .6s ease;
      -moz-transition: opacity .6s ease;
      -ms-transition: opacity .6s ease;
      -o-transition: opacity .6s ease;
      transition: opacity .6s ease;
  }
  #bar_inner span.show {
    opacity:1;
  }


#quiz span {display:block;margin-bottom:30px;}

#quiz .question {
    height: 48px;
}

#quiz .question_container {
    width:80%;
    display:block;
    margin:auto;
    overflow:hidden;
    margin-bottom:40px;
}

#quiz .question_container label:nth-child(2) {
    float:right;
}
/*#quiz .question_container label:last-child {*/
    /*display:none;*/
/*}*/
    #quiz>div>label {
        border-radius:15px;
        float:left;
        width:100px;
        height:35px;
        display:block;
        padding: 5px 20px;
        text-align: center;
        background:pink;
        background: -webkit-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -moz-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -o-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -ms-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: linear-gradient(0deg, #890052 0%, #c30075 100%);
    }
    #quiz>div>label>input {visibility:hidden!important;display:none;}
#page-fairpup-check .ongeschikt {
    padding-bottom:0px;
}
#page-fairpup-check .bones {
    left:0;
    bottom:-20px;
    position:relative;
    margin:0;
    width:548px;
}
    .ongeschikt .bones .quizbone:first-child {
        margin-left:0;
    }
    .ongeschikt .bones .quizbone {
        float:left;
        display:block;
        margin-left: 12%;
        background:url('../img/bone.png');
        width:35px;
        height:40px;
    }

#result {
    display: block;
    text-align: center;
}
    .result a {
        color:#c31b77;
        font-weight:600;
    }
        .result a:hover {
            color:#E52297;
            font-weight:700;
        }

/*page-waarom-een-fairpup*/
#page-waarom-een-fairpup {}

.guideline-list {}

.guideline {
    border-bottom:1px solid #c30075;
}
.guideline h3{margin-bottom:0;margin-top: 10px;}
.italic {font-style: italic;}
/*.guideline:last-of-type(p) {margin-bottom:10px;}*/
.guideline a {margin-bottom:20px;}


/*page-contact*/
#page-contact .textblock {
    display: block;
    margin-bottom: 75px;
}

form {
    height:auto;
    width:620px;
    padding:20px 30px 80px 25px;
    border-radius:10px;
    background-color:  #404041;
    position:relative;
}
    form a {
        display:block;
        color:#fff;
        text-decoration:none;
        margin-bottom:10px;
    }
    form ul {
        margin:0;
        padding:0;
        list-style:none;
        position:relative;
        overflow:hidden;
    }
        form:before {
            display:block;
            background:url('../img/contact-puppy.png')no-repeat;
            content:'';
            height:177px;
            width:212px;
            position:absolute;
            z-index:-1;
            top: -108px;
            left: 270px;
        }
        form ul li {

        }
            form ul li ul li{
                text-align:right;
            }
    form label {
        display:inline-block;
        vertical-align:middle;
        width:125px;
        height:34px;
        color:#fff;
        float:left;
        clear:left;
    }
        form label[for=id_message]{
            vertical-align:top;
            padding-top:5px;
        }
    form input {
        display:inline-block;
        vertical-align:middle;
        height:34px;
        width:440px;
        border-radius:10px;
        border:none;
        background:#fff;
        float:left;
        padding:10px;
    }
    form textarea {
        vertical-align:middle;
        height:105px;
        width:440px;
        border-radius:10px;
        border:none;
        background:#fff;
        float:left;
        margin-bottom:10px;
        padding:10px;
    }
    form button {
        float:right;
        color:#fff;
        border-radius:10px;
        font-weight:700;
        border:none;
        width: 135px;
        height: 55px;
        padding:16px;
        background:pink;
        background: -webkit-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -moz-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -o-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: -ms-linear-gradient(90deg, #890052 0%, #c30075 100%);
        background: linear-gradient(0deg, #890052 0%, #c30075 100%);
        margin-top:0px;
    }
    form .errorlist {
        color: #E52297;
    }

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
    .inner {
        width: 100%;
    }
    .textblock {padding-right: 20px;}
    .textblock a {
        height: auto;
    }
    .ongeschikt .loading {
        width:100%;
    }
    #page-fairpup-check .bones {
        width:100%;
    }
    form {width:auto;}
    form:before {left:170px;}
    form label {height:auto;}
    form input,form textarea {width:100%;}

    .initiative {padding:20px;}
    .copyright .inner {padding:20px;}

    footer {padding-bottom:0px;}

}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
    header {
        position:relative;
        width:100%;
        padding:20px;
        height:227px;
        left:auto;
    }
    header h1 a { float:none;margin: auto;}
    .header-pups {position:absolute;top:47px;width:100px;right:0;float:none;background-size: contain;top: 30px;width: 100px;height: auto;}
    #side-menu {display:none;}

    #toggle-menu {
        opacity:1;
    }

    #main {padding:20px;padding-top:0;margin-bottom:0px;min-height:0;}
        #content {margin-left:0px;}
    .textblock {padding:0;}

    .ongeschikt .bones {width:100%;margin-left:0;left:0;}
    .ongeschikt .bones .quizbone {
        margin-left:10%;
    }


}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
    header {
        height:196px;
        padding-bottom:20px;
    }
    header h1 {margin:0;}
    header h1 a {height:156px;}
    header nav {
        float:none;
        margin:0;
        left: -204px;
        top:180px;
        width:auto;
        -webkit-transition: .6s all;
        -moz-transition: .6s all;
        -ms-transition: .6s all;
        -o-transition: .6s all;
        transition: .6s all;
    }
    header nav ul{
       height:204px;
       width:204px;
       border:none;
    }
    header nav ul li a {
        height: auto;
        padding:3px 0;
        display: inline-block;
        vertical-align: middle;
        width: 100%;
        text-align: right !important;
        padding-right: 10px;
    }
    header nav ul li {
        width: 204px;
    }

    header h1 a {width: 126px;background-size: contain;}
    #main {padding-top:0;min-height:0px;margin-bottom:0px;}
        #content h2 {margin:0;}

    .ongeschikt {
        padding:20px 10px 50px 10px;
        margin-bottom:80px;
    }
    form:before {
        left:100px;
    }

    .textblock a {margin-left:50px;}
    .ongeschikt .bones .quizbone {
        margin-left:4%;
    }
    #toggle-menu:after {
        height:60px;
        width: 10%;
        padding-left: 35px;
        background: url('../img/paw.png')no-repeat left 0px top 10px;
    }
    form label {
        width:70px;
    }
    .errorlist{
        width:150px;
        float:right;
    }
    form label[for=id_message] {
        padding-top:0px;
    }

    #quiz>div>label {
        margin-top:30px;
    }
    #quiz .question_container {
        margin-bottom:20px;
    }
    header>div>.header-pups {max-width:96px;}
    header>div>.header-pups:nth-child(2) {width:90px;}

}

input[type=checkbox] {
  width: auto;
  -webkit-appearance: checkbox;
}

label[for^=id_agreed] {
  height: auto;
  width: auto;
}

@media only screen and (min-width: 768px) {
  label[for^=id_agreed] {
    margin-left: 120px;
  }
}

footer span a {
  color: #fff;
}