<div class="c-flyout js-flyout">
<div class="c-flyout__header">
<h1 class="c-flyout__title">Tags</h1>
<div class="c-icon c-flyout__icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M0,7.9l3-3l9,9l9-9l3,3L13.5,18.4c-0.4,0.4-0.9,0.6-1.5,0.6c-0.6,0-1.1-0.2-1.5-0.6L0,7.9z" />
</svg>
</div>
</div>
<div class="c-flyout__content">
<div class="c-flyout__container">
<div class="c-input c-input--multiple-select c-flyout__input">
<div class="c-input__wrapper
">
<div class="c-input__multiple-select" id="flyout-input-multiple-select">
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Aanslag" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Aanslag</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Cyber" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Cyber</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Maritiem" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Maritiem</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Media" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Media</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Overheid" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Overheid</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Ontploffing" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Ontploffing</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Schietincident" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Schietincident</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Staking" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Staking</p>
</label>
</div>
<div class="c-checkbox c-checkbox--reverse">
<label class="c-checkbox__container">
<div class="c-checkbox__checkbox-wrapper">
<input class="c-checkbox__input" type="checkbox" name="checkbox-button" value="Terreur" />
<span class="c-checkbox__holder">
<div class="c-icon c-icon--white c-checkbox__icon">
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
<polygon points="9.1,20.8 0,14.3 1.7,11.9 8.7,16.9 21.9,3.2 24,5.2 " />
</svg>
</div>
</span>
</div>
<p class="c-checkbox__label">Terreur</p>
</label>
</div>
<button class="c-button c-input__multiple-select-button c-button--without-skew">
<span class="c-button__text">Toepassen</span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
