/* global */
@font-face {
    font-family:PFOpenDyslexicR;
    src:url('OD-R.otf');
}
body
{
    background:#AADDEE url('../images/Master-Background.png') no-repeat top left;
    color:#000000;
    font-family:"PFOpenDyslexicR";
    font-size:14px;
    margin:0px;
    padding:0px;
}
a
{
    color:#000000;
    text-decoration:none;
}
a img { border:0px none #000000; }
hr { width:100%; }
.hasShadow
{
    box-shadow:4px 4px 0px rgba(0,0,0,0.35);
}
.errormessage
{
    background-color:#DD8888;
    border:1px solid #000000;
    color:#990000;
    margin:15px 0px;
    padding:3px 5px;
    text-align:center;
    width:100%;
}
input[type=text],
input[type=password]
{
    background-color:#FDFDFD;
    border:1px inset #F0F0F0;
    color:#000000;
    margin:1px;
    padding:2px;
    width:calc(100% - 10px);
}
input[type=button],
input[type=submit],
button
{
    background-color:#FFFFFF;
    border-radius:20px;
    border-width:0px;
    box-shadow:4px 4px 0px rgba(0,0,0,0.35);
    color:#BC1228;
    cursor:pointer;
    font-family:"PFOpenDyslexicR";
    font-size:18px;
    margin-bottom:4px;
}
button.clipPath
{
    background-color:transparent;
    border-color:transparent;
    border-radius:0;
    box-shadow:none;
    filter:drop-shadow(5px 5px 0px rgba(0,0,0,0.35));
}
button.clipPath::before
{
    background-color:#F1F1F3;
    bottom:0;
    content:'';
    left:0;
    position:absolute;
    right:0;
    top:0;
    z-index:-1;
}
input[type=button]:active,
input[type=submit]:active,
button:active
{
    box-shadow:none;
    margin-top:4px;
    margin-left:4px;
    margin-bottom:0px;
}
button.clipPath:active
{
    filter:none;
}
.sortable { cursor:pointer; }
.left { float:left; }
.message
{
    background-color:#88DD88;
    border:1px solid #000000;
    color:#009900;
    margin:15px 0px;
    padding:3px 5px;
    text-align:center;
    width:100%;
}
.noMargin { margin:0px; }
.noU { text-decoration:none; }
.noSelect
{
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    user-select:none;
}
p { margin-top:0px; }
.right { float:right; }
select { width:100%; }
select.date
{
    max-width:60px;
}
table
{
    border-collapse:collapse;
    table-layout:fixed;
}
textarea
{
    background-color:#FDFDFD;
    border:1px inset #F0F0F0;
    margin:1px;
    padding:2px;
    resize:none;
    width:calc(100% - 10px);
}
td
{
    text-align:justify;
    vertical-align:top;
}
td, th
{
    border-spacing:0px;
    padding:0px;
}
ul
{
    padding-left:15px;
}

/* popup */
.popupBackground
{
    background-color:rgba(0,0,0,0.5);
    display:none;
    height:100vh;
    left:0;
    position:fixed;
    top:0;
    width:100vw;
    z-index:1000;
}
.popupForeground
{
    background:#AADDEE;
    border:1px solid black;
    display:none;
    height:200px;
    padding:20px;
    position:fixed;
    left:calc(50vw - 225px);
    top:calc(50vh - 80px);
    width:490px;
    z-index:1001;
}

/* pagina-lijst */
.pagina-lijst span
{
    background-color:#5E9CFD;
    border-radius:5px;
    cursor:pointer;
    display:inline-block;
    margin:0px 2.5px;
    min-width:2em;
    text-align:center;
}
.pagina-lijst span:hover
{
    background-color:#87B6FF;
}
.pagina-lijst span.pagina-current,
.pagina-lijst span.pagina-current:hover
{
    cursor:default;
    font-weight:bold;
    background-color:#79D665;
}

/* login */
.login
{
    background:url('../images/Master-Content-Background.png') repeat-x;
    background-size:100% 100%;
    border-radius:20px;
    color:#FFFFFF;
    margin:250px auto 0px auto;
    padding:20px;
    height:160px;
    width:360px;
}
.login td
{
    padding:2px 3px;
}
.login td:nth-child(1)
{
    width:130px;
}
.login td:nth-child(2)
{
    width:200px;
}
.login input[type=submit]
{
    float:right;
    margin-top:50px;
}
.login input[type=submit]:active
{
    box-shadow:none;
    margin-right:-4px;
    margin-top:54px;
}
.login a
{
    color:#FFFFFF;
    float:right;
    font-size:10px;
    margin-right:30px;
}
.logout
{
    float:right;
}
.logout input[type=submit]:active
{
    box-shadow:none;
    margin-right:-4px;
    margin-top:4px;
}

/* master */
.master
{
    margin:0px auto 2em auto;
    padding:10px 5px 0 5px;
    width:1335px;
}
.footer
{
    background-color:#BAE3F1;
    border-top:3px dashed #FFFFFF;
    bottom:0;
    color:#003D5C;
    line-height:2em;
    position:fixed;
    text-align:center;
    width:100%;
    z-index:100;
}


/* teacher */
.view-user-chart
{
    width:100%;
}
.view-user-chart select
{
    display:block;
    width:300px;
}
#chart,
#gameLog
{
    border:0px none #000000;
    display:none;
    height:30px;
    width:1000px;
}
#gameLog
{
    width:700px;
}
.chart_body,
.gamelog_body
{
    background-image:unset;
}
.chart_body input,
.gamelog_body input
{
    transform:scale(0.6);
}
.chart_body input
{
    left:-20px;
    position:absolute;
    top:0px;
    z-index:5;
}
.user-game-log th,
.user-game-log td
{
    font-family:"Trebuchet MS";
    padding:2px 3px;
}
.user-game-log th
{
    border-bottom:1px solid #000000;
}
.user-game-log td
{
    text-align:right;
}
.user-game-log th:nth-child(3),
.user-game-log td:nth-child(3)
{
    border-right:1px solid #000000;
    padding-right:10px;
}
.user-game-log th:nth-child(4),
.user-game-log td:nth-child(4)
{
    padding-right:10px;
}
.list-leerlingen th
{
    border-bottom:1px solid #000000;
    padding:2px 3px;
}
.list-leerlingen th:nth-child(1) { min-width:200px; }
.list-leerlingen th:nth-child(2) { width:70px; }
.list-leerlingen th:nth-child(3) { width:80px; }
.list-leerlingen th:nth-child(4) { width:80px; }
.list-leerlingen th:nth-child(6),
.list-leerlingen th:nth-child(7),
.list-leerlingen th:nth-child(8),
.list-leerlingen th:nth-child(9) { width:20px; }
.list-leerlingen td
{
    padding:2px 3px;
    vertical-align:middle;
}
.list-leerlingen td:nth-child(2),
.list-leerlingen td:nth-child(3),
.list-leerlingen td:nth-child(6)
{
    border-left:1px solid #000000;
}
.list-leerlingen table tr td
{
    border:0 none #000000 !important;
    padding:0px 0px;
    vertical-align:middle;
    width:unset;
}
.list-leerlingen td img
{
    display:block;
}

.custom-settings th,
.custom-settings td
{
    padding:1px 3px;
    text-align:left;
}
.custom-settings th,
.custom-settings.levels td
{
    text-align:center;
}

.leerling-cost,
.buy-accounts
{
    border:1px solid #888888;
    float:left;
    height:180px;
    padding:10px;
    width:45%;
}
.buy-accounts
{
    float:right;
    height:160px;
    padding:20px;
}
.extend-account h2
{
    margin-top:0;
}
.extend-account select
{
    width:350px;
}
.buy-accounts input[type="text"] { width:40px; }
.buy-accounts select { width:180px; }
.buy-accounts input[type="submit"] { float:right; }
.leerling-cost table
{
    margin:0px auto;
}
.leerling-cost th:nth-child(1),
.leerling-cost th:nth-child(2),
.leerling-cost th:nth-child(3)
{
    border-bottom:1px solid #000000;
    width:120px;
}
.leerling-cost td
{
    padding:1px 2px;
}
.leerling-cost td:nth-child(2)
{
    border:1px solid #000000;
    border-width:0px 1px;
}
.leerling-cost tr:last-child td
{
    text-align:center;
}
.paymentResult
{
    background-color:#FF8080;
    border:2px solid #880808;
    color:#380808;
    padding:2px 5px;
}
.paymentResult-OK
{
    background-color:#80FF80;
    border:2px solid #088808;
    color:#083808;
    padding:2px 5px;
}

/* calendar */
.calendar-wrapper
{
    border:1px solid #888888;
    border-radius:5px;
    font-family:"Trebuchet MS";
    float:right;
    margin-right:70px;
    padding:5px;
    width:210px;
}
.calendar-wrapper > table
{
    background-color:#DDDDDD;
    width:210px;
}
.calendar-wrapper > table th
{
    vertical-align:middle;
}
.calendar-wrapper > table > tr:nth-child(1) th:nth-child(1),
.calendar-wrapper > table > tbody > tr:nth-child(1) th:nth-child(1) { width:20px; }
.calendar-wrapper > table > tr:nth-child(1) th:nth-child(2),
.calendar-wrapper > table > tbody > tr:nth-child(1) th:nth-child(2) { width:170px; }
.calendar-wrapper > table > tr:nth-child(1) th:nth-child(3),
.calendar-wrapper > table > tbody > tr:nth-child(1) th:nth-child(3) { width:20px; }
.calendar
{
    border:1px solid #999999;
    width:210px;
}
.calendar .today
{
    background:#C90000;
    color:#FFFFFF;
    padding:7px 0px;
}
.calendar .today:hover
{
    background:#860000;
}
.calendar .event
{
    background:#0086E3;
    color:#FFFFFF;
    padding:7px 0px;
}
.calendar .event:hover
{
    background:#004371;
}
.calendar .link
{
    background:#CCCCCC;
    color:#000000;
    padding:7px 0px;
}
.calendar .link:hover
{
    background:#DDDDDD;
}
.calendar td
{
    background:#CCCCCC;
    border:1px solid #999999;
    color:#000000;
    font-size:11px;
    font-weight:bold;
    text-align:center;
}
.calendar td:hover
{
    background:#666666;
}
.calendar .np
{
    background:#FFFFFF;
    border:1px solid #999999;
}
.calendar .np:hover
{
    background:#FFFFFF;
}
.calendar th
{
    background:#999999;
    border:1px solid #999999;
    font-weight:bold;
    text-align:center;
    width:28px;
}

/* admin edit (and logout) button */
.admin-edit
{
    background-color:#e53329;
    border:1px solid #000000;
    padding:2px 3px;
    float:right;
}
.admin-edit a
{
    color:#FFFFFF;
}

/* admin*/
.admin-userlistfilter
{
    width:30%
}
.admin-userlistfilter td:first-child { width:4em; }
.admin-userlistfilter td:last-child { width:1.5em; }
.admin-userlistfilter td:last-child img { margin-bottom:-0.25em; }
.list-users th
{
    border-bottom:1px solid #000000;
}
.list-users th:nth-child(1) { min-width:200px; }
.list-users th:nth-child(2) { width:50px; }
.list-users th:nth-child(3) { width:115px !important; }
.list-users th:nth-last-child(2),
.list-users th:nth-last-child(1) { width:20px; }
.list-users td
{
    padding:2px 3px;
    vertical-align:middle;
}
.list-users td:nth-last-child(2)
{
    border:0px solid #000000;
    border-left-width:1px;
}
.list-users td:nth-child(3)
{
    text-align:center;
}
.list-users td:nth-child(2),
.list-users td:nth-child(3)
{
    border:1px solid #000000;
    border-width:0px 1px;
}
.list-users td:nth-child(4)
{
    text-align:center;
}
.edit-user td:first-child
{
    width:210px;
}
.edit-user td:last-child
{
    width:250px;
}
.edit-user td
{
    height:25px;
    padding:2px 3px;
    vertical-align:middle;
}
.edit-user td[colspan="2"]
{
    border-bottom:1px solid #000000;
    height:10px;
}
.list-users tr:last-child td:last-child,
.edit-user tr:last-child td:last-child
{
    text-align:right;
}

/* demo slideshow */
.demoshow
{
    border:1px dashed #000000;
    height:1025px;
    overflow:hidden;
    position:relative;
    width:1345px;
}
.demoshow .next,
.demoshow .prev
{
    background-color:#FFFFFF;
    border:1px dashed #000000;
    border-radius:50%;
    cursor:pointer;
    display:block;
    height:56px;
    width:56px;
    z-index:99;
}
.demoshow .next
{
    left:calc(1345px - 100px);
    top:calc(50% - 32px);
}
.demoshow .prev
{
    display:none;
    left:20px;
    top:calc(50% - 32px);
}
.demoshow > div
{
    position:absolute;
}
.demoshow > div > div
{
    background-color:#AADDEE;
    opacity:1;
    position:absolute;
    transition:opacity 0.5s ease-out 0s;
}
.demoshow > div:last-child
{
    left:20px;
    top:25px;
    z-index:50;
}
.demoshow div > p
{
    background-color:#FFFFFF;
    border:1px dashed #208BC4;
    border-radius:10px;
    margin-left:20px;
    max-width:445px;
    padding:10px;
    position:absolute;
    top:100px;
}
.demo-1 > div > div,
.demo-2 > div > div,
.demo-3 > div > div
{
    background-position:top center;
    width:1340px;
    height:1023px;
}

/* slides game 1: zoekplaatje */
.demo-1 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Big-01.png'); } .eng .demo-1 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-Big-01.png'); }
.demo-1 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Big-02.png'); } .eng .demo-1 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-Big-02.png'); }
.demo-1 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Big-03.png'); } .eng .demo-1 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-Big-03.png'); }
.demo-1 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Big-04.png'); } .eng .demo-1 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-Big-04.png'); }
.demo-1 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Big-05.png'); } .eng .demo-1 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-Big-05.png'); }
.demo-1 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Big-06.png'); } .eng .demo-1 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-Big-06.png'); }
.demo-1 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Big-07.png'); } .eng .demo-1 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-Big-07.png'); }
.demo-1 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Big-08.png'); } .eng .demo-1 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-Big-08.png'); }
.demo-1 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Big-09.png'); } .eng .demo-1 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-Big-09.png'); }

/* slides game 2: letterdans */
.demo-2 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Big-11.png'); } .eng .demo-2 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-Big-11.png'); }
.demo-2 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Big-12.png'); } .eng .demo-2 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-Big-12.png'); }
.demo-2 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Big-13.png'); } .eng .demo-2 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-Big-13.png'); }
.demo-2 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Big-14.png'); } .eng .demo-2 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-Big-14.png'); }
.demo-2 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Big-15.png'); } .eng .demo-2 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-Big-15.png'); }
.demo-2 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Big-16.png'); } .eng .demo-2 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-Big-16.png'); }
.demo-2 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Big-17.png'); } .eng .demo-2 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-Big-17.png'); }
.demo-2 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Big-18.png'); } .eng .demo-2 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-Big-18.png'); }
.demo-2 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Big-19.png'); } .eng .demo-2 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-Big-19.png'); }
.demo-2 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Big-20.png'); } .eng .demo-2 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Eng-Big-20.png'); }
.demo-2 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Big-21.png'); } .eng .demo-2 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Eng-Big-21.png'); }

/* slides game 3: rekenmachientje */
.demo-3 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Big-22.png'); } .eng .demo-3 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-Big-22.png'); }
.demo-3 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Big-23.png'); } .eng .demo-3 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-Big-23.png'); }
.demo-3 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Big-24.png'); } .eng .demo-3 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-Big-24.png'); }
.demo-3 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Big-25.png'); } .eng .demo-3 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-Big-25.png'); }
.demo-3 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Big-26.png'); } .eng .demo-3 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-Big-26.png'); }
.demo-3 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Big-27.png'); } .eng .demo-3 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-Big-27.png'); }
.demo-3 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Big-28.png'); } .eng .demo-3 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-Big-28.png'); }
.demo-3 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Big-29.png'); } .eng .demo-3 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-Big-29.png'); }
.demo-3 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Big-30.png'); } .eng .demo-3 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-Big-30.png'); }
.demo-3 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Big-31.png'); } .eng .demo-3 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Eng-Big-31.png'); }
.demo-3 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Big-32.png'); } .eng .demo-3 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Eng-Big-32.png'); }

/*-------------------------------------- small screen --------------------------------------*/
@media screen and (max-height:1065px)
{
    input[type=button],
    input[type=submit]
    {
        border-radius:12px;
    }
    .login { margin-top:150px; }
    .master { margin-bottom:3em; padding:5px 5px; width:1000px; }
    .footer { line-height:3em; }
    
    /* demo slideshow */
    .demoshow
    {
        height:720px;
        width:1020px;
    }
    .demoshow .next
    {
        left:calc(1020px - 100px);
    }
    .demoshow div > p
    {
        max-width:295px;
    }
    .demo-1 > div > div,
    .demo-2 > div > div,
    .demo-3 > div > div
    {
        height:720px;
        width:1020px;
    }
    
    /* slides game 1: zoekplaatje */
    .demo-1 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-01.png'); } .eng .demo-1 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-01.png'); }
    .demo-1 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-02.png'); } .eng .demo-1 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-02.png'); }
    .demo-1 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-03.png'); } .eng .demo-1 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-03.png'); }
    .demo-1 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-04.png'); } .eng .demo-1 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-04.png'); }
    .demo-1 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-05.png'); } .eng .demo-1 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-05.png'); }
    .demo-1 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-06.png'); } .eng .demo-1 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-06.png'); }
    .demo-1 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-07.png'); } .eng .demo-1 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-07.png'); }
    .demo-1 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-08.png'); } .eng .demo-1 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-08.png'); }
    .demo-1 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-09.png'); } .eng .demo-1 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-09.png'); }
    
    /* slides game 2: letterdans */
    .demo-2 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-11.png'); } .eng .demo-2 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-11.png'); }
    .demo-2 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-12.png'); } .eng .demo-2 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-12.png'); }
    .demo-2 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-13.png'); } .eng .demo-2 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-13.png'); }
    .demo-2 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-14.png'); } .eng .demo-2 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-14.png'); }
    .demo-2 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-15.png'); } .eng .demo-2 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-15.png'); }
    .demo-2 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-16.png'); } .eng .demo-2 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-16.png'); }
    .demo-2 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-17.png'); } .eng .demo-2 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-17.png'); }
    .demo-2 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-18.png'); } .eng .demo-2 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-18.png'); }
    .demo-2 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-19.png'); } .eng .demo-2 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-19.png'); }
    .demo-2 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-20.png'); } .eng .demo-2 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Eng-20.png'); }
    .demo-2 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-21.png'); } .eng .demo-2 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Eng-21.png'); }
    
    /* slides game 3: rekenmachientje */
    .demo-3 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-22.png'); } .eng .demo-3 > div:nth-child( 1) > div { background-image:url('../images/demo/Demos-Eng-22.png'); }
    .demo-3 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-23.png'); } .eng .demo-3 > div:nth-child( 2) > div { background-image:url('../images/demo/Demos-Eng-23.png'); }
    .demo-3 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-24.png'); } .eng .demo-3 > div:nth-child( 3) > div { background-image:url('../images/demo/Demos-Eng-24.png'); }
    .demo-3 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-25.png'); } .eng .demo-3 > div:nth-child( 4) > div { background-image:url('../images/demo/Demos-Eng-25.png'); }
    .demo-3 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-26.png'); } .eng .demo-3 > div:nth-child( 5) > div { background-image:url('../images/demo/Demos-Eng-26.png'); }
    .demo-3 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-27.png'); } .eng .demo-3 > div:nth-child( 6) > div { background-image:url('../images/demo/Demos-Eng-27.png'); }
    .demo-3 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-28.png'); } .eng .demo-3 > div:nth-child( 7) > div { background-image:url('../images/demo/Demos-Eng-28.png'); }
    .demo-3 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-29.png'); } .eng .demo-3 > div:nth-child( 8) > div { background-image:url('../images/demo/Demos-Eng-29.png'); }
    .demo-3 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-30.png'); } .eng .demo-3 > div:nth-child( 9) > div { background-image:url('../images/demo/Demos-Eng-30.png'); }
    .demo-3 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-31.png'); } .eng .demo-3 > div:nth-child(10) > div { background-image:url('../images/demo/Demos-Eng-31.png'); }
    .demo-3 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-32.png'); } .eng .demo-3 > div:nth-child(11) > div { background-image:url('../images/demo/Demos-Eng-32.png'); }
}