Gebruiker:IdP/kladblok09
Uit TheaterEncyclopedie
Test NA fotogalerij met grid
waarbij afbeeldingen op vaste maat van elkaar afstaan en niet flikkeren
{{#css:
.na-img {
display: grid;
grid-template-columns: repeat(3, 1fr);
}
@media (min-width: 576px) { .na-img {grid-template-columns: repeat(4, 1fr);} }
@media (min-width: 768px) { .na-img {grid-template-columns: repeat(5, 1fr);} }
@media (min-width: 992px) { .na-img {grid-template-columns: repeat(6, 1fr);} }
@media (min-width: 1200px) { .na-img {grid-template-columns: repeat(8, 1fr);} }
.img-modal-vooraf img {
align-content: center;
width: 50px;
height: 240px;
object-fit: cover;
border-radius: 10px;
margin-right: 2px;
background-position: center;
transition: width 0.8s ease-in-out;
z-index: 1;
}
.img-modal-vooraf img:hover {
width: 200px;
height: 240px;
z-index: 2;
}
.na-card {border: 10px solid rgb(68, 78, 85);}
.na-card-info {border: 1px solid rgba(68, 78, 85, 0.4);}
}}
<div class="col na-img">
<div data-toggle="modal" href="#myModaltestNA01" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA01}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1708-klein.jpg|class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA01">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1708-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-columns="4" data-toggle="modal" href="#myModaltestNA02" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA02}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1709-klein.jpg|class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA02">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1709-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-columns="4" data-toggle="modal" href="#myModaltestNA03" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA03}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1710-klein.jpg|200px|class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA03">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1710-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA04" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA04}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1711-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA04">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1711-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-columns="4" data-toggle="modal" href="#myModaltestNA05" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA05}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1712-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA05">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1712-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA06" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA06}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1713-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA06">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1713-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA07" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA07}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1714-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA07">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1714-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA08" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA08}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1715-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA08">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1715-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA09" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA09}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1736-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA09">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1736-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA10" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA10}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1737-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA10">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1737-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-columns="4" data-toggle="modal" href="#myModaltestNA11" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA11}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1738-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA11">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1738-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1708-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-columns="4" data-toggle="modal" href="#myModaltestNA02" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA02}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1709-klein.jpg|class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA02">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1709-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA03" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA03}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1710-klein.jpg|200px|class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA03">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1710-klein.jpg|class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA04" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA04}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1711-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA04">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1711-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA05" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA05}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1712-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA05">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1712-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA06" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA06}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1713-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA06">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1713-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA07" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA07}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1714-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA07">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1714-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA08" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA08}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1715-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA08">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1715-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA09" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA09}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1736-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA09">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1736-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA10" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA10}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1737-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA10">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1737-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
<div data-toggle="modal" href="#myModaltestNA11" class="btn btn-link img-modal-vooraf" type="button" data-target="#{{{id|myModaltestNA11}}}">
[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1738-klein.jpg||class=card-img|link=]]
</div>
<div class="modal" id="myModaltestNA11">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="container"></div>
<div class="modal-body na-card ">
<div class="row d-flex justify-content-end pr-4"><btn type="button" class="close" data-dismiss="modal" aria-hidden="true">×</btn></div>
<div class="row na-row">
<div class="col-sm-4 p-1 text-center font-italic">
<div class="card-body">[[Bestand: Test-NL-HaNA 2.24.01.09 0 902-1738-klein.jpg||class=card-img|link=]]
</div><!-- eof card-body -->
</div><!-- eof col1 -->
<div class="col-sm-8 p-2">
<div class="card-body">
<h3 class="card-title">Informatie</h3>
<h5 class="card-title">Nationaal Archief</h5>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<h5 class="card-title">Beschrijving</h5>
<p class="card-text">Scene uit "Warenar" (van P.C. Hooft) door het Residentietoneel</p>
<p class="card-text"><small class="text-muted">1947-05-20</small></p>
</div><!-- eof card-body -->
</div><!-- eof col2 -->
</div><!-- eof row -->
<div class="row d-flex justify-content-end"><btn type="btn" class="btn btn-default" data-dismiss="modal">Sluiten</btn></div>
</div><!-- eof modal-body -->
</div><!-- eof modal-content -->
</div><!-- eof modal-dialog -->
</div><!--eof modal-->
</div><!-- EOF row -->