<div id="content-settings-page" class="page" hidden>
  <div class="close-button"></div>
  <h1 i18n-content="contentSettingsPage"></h1>
  <div class="content-area">
    <!-- Cookie filter tab contents -->
    <section>
      <h3 i18n-content="cookiesTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="cookies" value="allow">
            <span>
              <span i18n-content="cookiesAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="cookies" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="cookies" value="session_only">
            <span>
              <span i18n-content="cookiesSessionOnly"></span>
              <span class="controlled-setting-indicator"
                  content-setting="cookies" value="session_only"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="cookies" value="block">
            <span>
              <span i18n-content="cookiesBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="cookies" value="block"></span>
            </span>
          </label>
        </div>
        <div class="checkbox controlled-setting-with-label">
          <label>
            <input pref="profile.block_third_party_cookies" type="checkbox">
            <span>
              <span i18n-content="cookiesBlock3rdParty"></span>
              <span class="controlled-setting-indicator"
                  pref="profile.block_third_party_cookies"></span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="cookies"
              i18n-content="manageExceptions"></button>
          <button id="show-cookies-button"
              i18n-content="cookiesShowCookies"></button>
        </div>
     </div>
    </section>
    <!-- Image filter -->
    <section>
      <h3 i18n-content="imagesTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="images" value="allow">
            <span>
              <span i18n-content="imagesAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="images" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="images" value="block">
            <span>
              <span i18n-content="imagesBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="images" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="images"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- JavaScript filter -->
    <section>
      <h3 i18n-content="javascriptTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="javascript" value="allow">
            <span>
              <span i18n-content="javascriptAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="javascript" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="javascript" value="block">
            <span>
              <span i18n-content="javascriptBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="javascript" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="javascript"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Keygen filter -->
    <section>
      <h3 i18n-content="keygenTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="keygen" value="allow">
            <span>
              <span i18n-content="keygenAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="keygen" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="keygen" value="block">
            <span>
              <span i18n-content="keygenBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="keygen" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="keygen"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Handlers settings -->
    <section id="handlers-section">
      <h3 i18n-content="handlersTabLabel"></h3>
      <div>
        <div class="radio">
          <label>
            <input type="radio" name="handlers" value="allow"
                class="handler-radio">
            <span i18n-content="handlersAllow"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="handlers" value="block"
                class="handler-radio">
            <span i18n-content="handlersBlock"></span>
          </label>
        </div>
        <div class="settings-row">
          <button id="manage-handlers-button" contentType="handlers"
              i18n-content="manageHandlers"></button>
        </div>
      </div>
    </section>
    <!-- Plugins filter -->
    <section>
      <h3 i18n-content="pluginsTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input id="plugins-allow-radio" type="radio" name="plugins"
                   value="allow">
            <span>
              <span i18n-content="pluginsAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="plugins" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="plugins" value="detect_important_content">
            <span>
              <span i18n-content="pluginsDetectImportantContent"></span>
              <span class="controlled-setting-indicator"
                  content-setting="plugins" value="detect_important_content"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="plugins" value="block">
            <span>
              <span i18n-content="pluginsBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="plugins" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="plugins"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Pop-ups filter -->
    <section>
      <h3 i18n-content="popupsTabLabel" class="content-settings-header"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="popups" value="allow">
            <span>
              <span i18n-content="popupsAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="popups" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="popups" value="block">
            <span>
              <span i18n-content="popupsBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="popups" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="popups"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Location filter -->
    <section>
      <h3 i18n-content="locationTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="location" value="allow">
            <span>
              <span i18n-content="locationAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="location" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="location" value="ask">
            <span>
              <span i18n-content="locationAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="location" value="ask"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="location"
                value="block">
            <span>
              <span i18n-content="locationBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="location" value="block"></span>
            </span>
          </label>
        </div>
<if expr="enable_google_now">
        <div class="checkbox controlled-setting-with-label"
            id="geolocationCheckbox" hidden>
          <label>
            <input pref="googlegeolocationaccess.enabled"
                metric="Options_GoogleGeolocationAccessCheckbox"
                type="checkbox">
            <span>
              <span i18n-content="googleGeolocationAccessEnable"></span>
              <span class="controlled-setting-indicator"
                  pref="googlegeolocationaccess.enabled"></span>
            </span>
          </label>
        </div>
</if>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="location"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Notifications filter tab contents -->
    <section id="notifications-section">
      <h3 i18n-content="notificationsTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="notifications" value="allow">
            <span>
              <span i18n-content="notificationsAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="notifications" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="notifications" value="ask">
            <span>
              <span i18n-content="notificationsAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="notifications" value="ask"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="notifications" value="block">
            <span>
              <span i18n-content="notificationsBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="notifications" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="notifications"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
<if expr="chromeos or is_win">
    <!-- Protected Content filter -->
    <section guest-visibility="disabled">
      <h3 i18n-content="protectedContentTabLabel"
          class="content-settings-header"></h3>
      <div>
        <div class="settings-row">
          <p i18n-content="protectedContentInfo"></p>
        </div>
        <div class="checkbox">
          <label>
            <input pref="settings.privacy.drm_enabled" type="checkbox">
            <span i18n-content="protectedContentEnable"></span>
          </label>
        </div>
  <if expr="chromeos">
        <div class="settings-row">
          <button id="protected-content-exceptions"
              class="exceptions-list-button" contentType="protectedContent"
              i18n-content="manageExceptions"></button>
        </div>
  </if>
      </div>
    </section>
</if>
    <!-- Microphone filter -->
    <section id="media-stream-mic">
      <h3 i18n-content="mediaStreamMicTabLabel"></h3>
      <div>
        <span id="media-select-mic-label"
            i18n-content="mediaSelectMicLabel" hidden></span>
        <select id="media-select-mic" class="weakrtl media-device-control"
            aria-labelledby="media-select-mic-label"></select>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="media-stream-mic" value="ask">
            <span>
              <span i18n-content="mediaStreamMicAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="media-stream-mic" value="ask"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="media-stream-mic" value="block">
            <span>
              <span i18n-content="mediaStreamMicBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="media-stream-mic" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="media-stream-mic"
              i18n-content="manageExceptions"></button>
        </div>
        <div id="media-pepper-flash-default-mic" class="pepper-flash-settings">
          <span i18n-content="mediaPepperFlashMicDefaultDivergedLabel"></span>
          <a target="_blank" i18n-content="mediaPepperFlashChangeLink"
              i18n-values="href:mediaPepperFlashGlobalPrivacyURL"></a>
        </div>
      </div>
    </section>
    <!-- Camera filter -->
    <section id="media-stream-camera">
      <h3 i18n-content="mediaStreamCameraTabLabel"></h3>
      <div>
        <span id="media-select-camera-label"
            i18n-content="mediaSelectCameraLabel" hidden></span>
        <select id="media-select-camera" class="weakrtl media-device-control"
            aria-labelledby="media-select-camera-label"></select>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="media-stream-camera" value="ask">
            <span>
              <span i18n-content="mediaStreamCameraAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="media-stream-camera" value="ask"></span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="media-stream-camera" value="block">
            <span>
              <span i18n-content="mediaStreamCameraBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="media-stream-camera" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button"
              contentType="media-stream-camera" i18n-content="manageExceptions">
          </button>
        </div>
        <div id="media-pepper-flash-default-camera"
            class="pepper-flash-settings">
          <span i18n-content="mediaPepperFlashCameraDefaultDivergedLabel">
          </span>
          <a target="_blank" i18n-content="mediaPepperFlashChangeLink"
              i18n-values="href:mediaPepperFlashGlobalPrivacyURL"></a>
        </div>
      </div>
    </section>
    <!-- PPAPI broker -->
    <section>
      <h3 i18n-content="ppapiBrokerTabLabel"></h3>
      <div>
        <div class="radio">
          <label>
            <input type="radio" name="ppapi-broker" value="allow">
            <span>
              <span i18n-content="ppapiBrokerAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="ppapi-broker" value="allow"></span>
            </span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="ppapi-broker" value="ask">
            <span>
              <span i18n-content="ppapiBrokerAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="ppapi-broker" value="ask"></span>
            </span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="ppapi-broker" value="block">
            <span>
              <span i18n-content="ppapiBrokerBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="ppapi-broker" value="block"></span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="ppapi-broker"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Automatic Downloads filter -->
    <section>
      <h3 i18n-content="multipleAutomaticDownloadsTabLabel"></h3>
      <div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="multiple-automatic-downloads"
                value="allow">
            <span>
              <span i18n-content="multipleAutomaticDownloadsAllow"></span>
              <span class="controlled-setting-indicator"
                  content-setting="multiple-automatic-downloads" value="allow">
              </span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="multiple-automatic-downloads" value="ask">
            <span>
              <span i18n-content="multipleAutomaticDownloadsAsk"></span>
              <span class="controlled-setting-indicator"
                  content-setting="multiple-automatic-downloads" value="ask">
              </span>
            </span>
          </label>
        </div>
        <div class="radio controlled-setting-with-label">
          <label>
            <input type="radio" name="multiple-automatic-downloads"
                value="block">
            <span>
              <span i18n-content="multipleAutomaticDownloadsBlock"></span>
              <span class="controlled-setting-indicator"
                  content-setting="multiple-automatic-downloads" value="block">
              </span>
            </span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button"
              contentType="multiple-automatic-downloads"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- MIDI system exclusive messages filter -->
    <section>
      <h3 i18n-content="midiSysexHeader"></h3>
      <div>
        <div class="radio">
          <label>
            <input type="radio" name="midi-sysex" value="allow">
            <span i18n-content="midiSysExAllow"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="midi-sysex" value="ask">
            <span i18n-content="midiSysExAsk"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="midi-sysex" value="block">
            <span i18n-content="midiSysExBlock"></span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="midi-sysex"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Push messaging filter -->
    <section id="experimental-push-messaging-settings" hidden="true">
      <h3 i18n-content="pushMessagingHeader"></h3>
      <div>
        <div class="radio">
          <label>
            <input type="radio" name="push-messaging" value="allow">
            <span i18n-content="pushMessagingAllow"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="push-messaging" value="ask">
            <span i18n-content="pushMessagingAsk"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="push-messaging" value="block">
            <span i18n-content="pushMessagingBlock"></span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="push-messaging"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- USB devices -->
    <section>
      <h3 i18n-content="usbDevicesHeader"></h3>
      <div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="usb-devices"
              i18n-content="usbDevicesManage"></button>
        </div>
      </div>
    </section>
    <!-- Background sync -->
    <section>
      <h3 i18n-content="backgroundSyncHeader"></h3>
      <div>
        <div class="radio">
          <label>
            <input type="radio" name="background-sync" value="allow">
            <span i18n-content="backgroundSyncAllow"></span>
          </label>
        </div>
        <div class="radio">
          <label>
            <input type="radio" name="background-sync" value="block">
            <span i18n-content="backgroundSyncBlock"></span>
          </label>
        </div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="background-sync"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- Page zoom levels -->
    <section id="page-zoom-levels">
      <h3 i18n-content="zoomlevelsHeader"></h3>
      <div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="zoomlevels"
              i18n-content="zoomLevelsManage"></button>
        </div>
      </div>
    </section>
    <!-- Fullscreen filter -->
    <!-- TODO(mgiuca): Delete this once per-site data deleted.
         https://crbug.com/591896 -->
    <section id="fullscreen-section">
      <h3 i18n-content="fullscreenTabLabel"></h3>
      <p i18n-content="fullscreenDeprecated"></p>
      <div class="settings-row">
        <button class="exceptions-list-button" contentType="fullscreen"
            i18n-content="manageExceptions"></button>
      </div>
    </section>
    <!-- Mouse Lock filter -->
    <!-- TODO(mgiuca): Delete this once per-site data deleted.
         https://crbug.com/591896 -->
    <section id="mouselock-section">
      <h3 i18n-content="mouselockTabLabel"></h3>
      <p i18n-content="mouselockDeprecated"></p>
      <div>
        <div class="settings-row">
          <button class="exceptions-list-button" contentType="mouselock"
              i18n-content="manageExceptions"></button>
        </div>
      </div>
    </section>
    <!-- PDF Plugin filter -->
    <section id="pdf-section">
      <h3 i18n-content="pdfTabLabel" class="content-settings-header"></h3>
      <div>
        <div class="checkbox">
          <label>
            <input pref="plugins.always_open_pdf_externally" type="checkbox">
            <span>
              <span i18n-content="pdfEnable"></span>
              <span class="controlled-setting-indicator"
                  pref="plugins.always_open_pdf_externally">
              </span>
            </span>
          </label>
        </div>
      </div>
    </section>
  </div>
  <div class="action-area">
    <div class="button-strip">
      <button id="content-settings-overlay-confirm" class="default-button"
          i18n-content="done">
      </button>
    </div>
  </div>
</div>