diff --git a/src/components/app.jsx b/src/components/app.jsx
index 15155b9..96a6e84 100644
--- a/src/components/app.jsx
+++ b/src/components/app.jsx
@@ -2,8 +2,9 @@ import { h, Component } from 'preact';
 import style from './app.less';
 import { currentLocale } from '../lib/localize';
 
-import PopupFooter from './popup/popupFooter';
 import Popup from './popup/popup';
+import PopupFooter from './popup/popupFooter';
+import PopupThin from './popup/popupThin';
 import Footer from './footer/footer';
 
 export default class App extends Component {
@@ -104,11 +105,15 @@ export default class App extends Component {
 				const target = event.target;
 				const showConsentToolButtonClicked = RegExp('showConsentTool').test(target.getAttribute('onclick'));
 				const appDiv = self.base;
+				const { layout } = config;
 
 				if (!showConsentToolButtonClicked && !appDiv.contains(target)) {
 					store.toggleConsentToolShowing(false);
+
 					// Render footer style CMP if no consent decision has been submitted yet
-					if (!cmp.submitted) store.toggleFooterConsentToolShowing(true);
+					if (!cmp.submitted) {
+						layout !== 'thin' ? store.toggleFooterConsentToolShowing(true) : store.toggleThinConsentToolShowing(true);
+					}
 				};
 			}, false);
 		}
@@ -134,7 +139,7 @@ export default class App extends Component {
 	render(props, state) {
 		const { store } = state;
 		const { config } = props;
-		const userLocalization = config.localization[currentLocale];
+		const userLocalization = config.localization[currentLocale.split('-')[0]];
 
 		return (
 			<div class={style.gdpr}>
@@ -152,6 +157,13 @@ export default class App extends Component {
 					config={config}
 					updateCSSPrefs={this.updateCSSPrefs}
 				/>
+				<PopupThin
+					store={store}
+					localization={userLocalization}
+					onSave={this.onSave}
+					config={config}
+					updateCSSPrefs={this.updateCSSPrefs}
+				/>
 				<Footer
 					store={store}
 					localization={userLocalization}
diff --git a/src/components/popup/intro/footer.jsx b/src/components/popup/intro/footer.jsx
index e905092..b452380 100644
--- a/src/components/popup/intro/footer.jsx
+++ b/src/components/popup/intro/footer.jsx
@@ -36,6 +36,14 @@ export default class IntroFooter extends Component {
             store
         } = props;
 
+        let allPurposes = [];
+        if (store.vendorList && store.vendorList.purposes) {
+            allPurposes = allPurposes.concat(store.vendorList.purposes);
+        }
+        if (store.customPurposeList && store.customPurposeList.purposes) {
+            allPurposes = allPurposes.concat(store.customPurposeList.purposes);
+        }
+
         return (
             <div>
                 {!showFull &&
@@ -64,7 +72,7 @@ export default class IntroFooter extends Component {
                         </LocalLabel>
                         <LocalLabel providedValue={localization && localization.footer ? localization.footer.purposesHeader : ''} localizeKey='footer.purposesHeader' class={style.message2 + " primaryText"}>Purposes for storing information:</LocalLabel>
                         <ul>
-                            {store && store.vendorList && store.vendorList.purposes && store.vendorList.purposes.map((purpose) => {
+                            {allPurposes.map((purpose) => {
                                 return <li class="primaryText">{purpose.name}</li>
                             })}
                         </ul>
diff --git a/src/components/popup/intro/footerV2.jsx b/src/components/popup/intro/footerV2.jsx
index 244b340..3234883 100644
--- a/src/components/popup/intro/footerV2.jsx
+++ b/src/components/popup/intro/footerV2.jsx
@@ -21,6 +21,10 @@ export default class IntroFooterV2 extends Component {
         }, this.props.updateCSSPrefs);
     }
 
+    componentDidUpdate() {
+        this.props.updateCSSPrefs();
+    }
+
     componentDidMount() {
         this.props.updateCSSPrefs();
     }
@@ -33,16 +37,39 @@ export default class IntroFooterV2 extends Component {
             localization,
             onShowPurposes,
             onAcceptAll,
-            store
+            store,
+            config
         } = props;
 
+        let allPurposes = [];
+        if (store.vendorList && store.vendorList.purposes) {
+            allPurposes = allPurposes.concat(store.vendorList.purposes);
+        }
+        if (store.customPurposeList && store.customPurposeList.purposes) {
+            allPurposes = allPurposes.concat(store.customPurposeList.purposes);
+        }
+
+        const { isThinConsentToolShowing } = store;
+
         return (
             <div class={style.footerV2}>
                 {!showFull &&
-                    <div class={style.base + " " + style.collapsed}>
-                        <span name="ctrl" class={style.icon} onClick={this.handleShow}></span>
-                        <LocalLabel providedValue={localization && localization.footer ? localization.footer.message : ''} localizeKey='footer.message' class={style.message + " primaryText"}>Read more about access and use of information on your device for various purposes.</LocalLabel>
-                    </div>}
+                    <div class={style.base + " " + style.collapsed + " " + style.wrapper}>
+                        <div style="display: flex; justify-content: space-between;">
+                            <span name="ctrl" class={style.icon} onClick={this.handleShow}></span>
+                            <LocalLabel providedValue={localization && localization.footer ? localization.footer.message : ''} localizeKey='footer.message' class="primaryText">Read more about access and use of information on your device for various purposes.</LocalLabel>
+                        </div>
+                        {isThinConsentToolShowing &&
+                            <Button
+                                class={style.rejectAll + " " + style.button}
+                                invert={true}
+                                onClick={onShowPurposes}
+                            >
+                                <LocalLabel providedValue={localization && localization.intro ? localization.intro.showPurposes : ''} localizeKey='intro.showPurposes'>Learn more</LocalLabel>
+                            </Button>
+                        }
+                    </div>
+                }
                 {showFull && <div class={style.container}>
                     <div class={style.base + " " + style.extended}>
                         <span name="ctrl" class={style.iconDown} onClick={this.handleShow}></span>
@@ -66,7 +93,7 @@ export default class IntroFooterV2 extends Component {
 
                             <LocalLabel providedValue={localization && localization.footer ? localization.footer.purposesHeader : ''} localizeKey='footer.purposesHeader' class={style.message2 + " primaryText"}>Purposes for storing information:</LocalLabel>
                             <ul>
-                                {store && store.vendorList && store.vendorList.purposes && store.vendorList.purposes.map((purpose) => {
+                                {allPurposes.map((purpose) => {
                                     return <li class="primaryText">{purpose.name}</li>
                                 })}
                             </ul>
diff --git a/src/components/popup/intro/footerV2.less b/src/components/popup/intro/footerV2.less
index 65d9260..7526d79 100644
--- a/src/components/popup/intro/footerV2.less
+++ b/src/components/popup/intro/footerV2.less
@@ -85,6 +85,7 @@
 
 .wrapper {
     display: flex;
+    justify-content: space-between;
 }
 
 .content {
diff --git a/src/components/popup/intro/introThin.jsx b/src/components/popup/intro/introThin.jsx
new file mode 100644
index 0000000..37de641
--- /dev/null
+++ b/src/components/popup/intro/introThin.jsx
@@ -0,0 +1,60 @@
+import { h, Component } from 'preact';
+import style from './introThin.less';
+import Button from '../../button/button';
+import Label from '../../label/label';
+import IntroFooterV2 from './footerV2';
+
+class LocalLabel extends Label {
+  static defaultProps = {
+    prefix: 'intro'
+  };
+}
+
+export default class IntroThin extends Component {
+
+  static defaultProps = {};
+
+  componentDidMount() {
+    this.props.updateCSSPrefs();
+  }
+
+  render(props, state) {
+    const {
+      onAcceptAll,
+      onShowPurposes,
+      onClose,
+      localization,
+      store,
+      updateCSSPrefs,
+      config
+    } = props;
+
+    return (
+      <div class={style.intro}>
+        <div class={style.topWrapper}>
+          <div class={style.textWrapper}>
+            <div class={style.description + " primaryText"}>
+              <LocalLabel providedValue={localization && localization.intro ? localization.intro.description : ''} localizeKey='description' class={style.contentMessage}>Ads help us run this site. When you use our site selected companies may access and use information on your device for various purposes including to serve relevant ads or personalised content.</LocalLabel>
+            </div>
+          </div>
+          <div class={style.options}>
+            <Button
+              class={style.acceptAll}
+              onClick={onAcceptAll}
+              >
+              <LocalLabel providedValue={localization && localization.intro ? localization.intro.acceptAll : ''} localizeKey='acceptAll'>Accept all</LocalLabel>
+            </Button>
+          </div>
+        </div>
+        <IntroFooterV2
+          onShowPurposes={onShowPurposes}
+          onAcceptAll={onAcceptAll}
+          localization={localization}
+          store={store}
+          updateCSSPrefs={updateCSSPrefs}
+          config={config}
+        />
+      </div>
+    );
+  }
+}
diff --git a/src/components/popup/intro/introThin.less b/src/components/popup/intro/introThin.less
new file mode 100644
index 0000000..31ba3d2
--- /dev/null
+++ b/src/components/popup/intro/introThin.less
@@ -0,0 +1,82 @@
+@import '../../../style/variables';
+
+.imagePadding {
+    padding-left: 10px;
+}
+
+div.intro {
+padding: 0 32px;
+max-height: 100%;
+
+    .topWrapper {
+        display: flex;
+        justify-content: space-between;
+
+        .textWrapper {
+            display: flex;
+            flex-direction: column;
+
+            .titleContainer {
+                padding: 10px 0;
+                font-size: 30px;
+                font-weight: bold;
+
+                .title {
+                    float: left;
+                    line-height: 1.5;
+                }
+            }
+            .description {
+                padding: 10px 10px 10px 0px;
+            }
+        }
+        .options {
+            display: flex;
+            flex-direction: column;
+            padding-top: 10px;
+
+            button {
+                margin: 5px;
+            }
+        }
+    }
+    .contentMessage {
+        padding-right: 32px;
+    }
+    .rejectAll {
+        width: 270px;
+        margin-right: 10px !important;
+    }
+
+    .acceptAll {
+        width: 270px;
+        margin-right: -25px !important;
+    }
+}
+
+@media (max-width: 800px) {
+    .topWrapper {
+        display: block !important;
+
+        .description {
+            padding: 10px !important;
+            display: block !important;
+        }
+        .options {
+            margin: 0 auto !important;
+        }
+    }
+}
+
+@media (max-width: 620px) {
+    .description {
+        display: block !important;
+    }
+    .topWrapper {
+        display: block !important;
+
+        .options {
+            margin: 0 auto !important;
+        }
+    }
+}
diff --git a/src/components/popup/intro/introV2.jsx b/src/components/popup/intro/introV2.jsx
index 63777fb..13b788b 100644
--- a/src/components/popup/intro/introV2.jsx
+++ b/src/components/popup/intro/introV2.jsx
@@ -70,6 +70,7 @@ export default class IntroV2 extends Component {
           localization={localization}
           store={store}
           updateCSSPrefs={updateCSSPrefs}
+          config={config}
         />
       </div>
     );
diff --git a/src/components/popup/popupThin.jsx b/src/components/popup/popupThin.jsx
new file mode 100644
index 0000000..85bfe71
--- /dev/null
+++ b/src/components/popup/popupThin.jsx
@@ -0,0 +1,86 @@
+import { h, Component } from 'preact';
+import style from './popupThin.less';
+import IntroThin from './intro/introThin';
+import Details from './details/details';
+import Panel from '../panel/panel';
+
+
+const SECTION_INTRO = 0;
+const SECTION_DETAILS = 1;
+
+export default class PopupThin extends Component {
+  state = {
+    selectedPanelIndex: SECTION_INTRO,
+    isActive: false
+  };
+
+  onAcceptAll = () => {
+    const { store, onSave } = this.props;
+    store.selectAllVendors(true);
+    store.selectAllPurposes(true);
+    store.selectAllCustomPurposes(true);
+    onSave();
+  };
+
+  onCancel = () => {
+    this.setState({
+      selectedPanelIndex: SECTION_INTRO,
+      isActive: false
+    });
+  };
+
+  handleShowDetails = () => {
+    this.setState({
+      selectedPanelIndex: SECTION_DETAILS,
+      isActive: true
+    });
+  };
+
+  handleClose = () => {};
+
+  componentDidMount() {
+    this.props.updateCSSPrefs();
+  }
+
+  render(props, state) {
+    const { store, localization, config, updateCSSPrefs } = props;
+    const { selectedPanelIndex, isActive } = state;
+    const { isThinConsentToolShowing } = store;
+
+    return (
+      <div
+        class={config.blockBrowsing ? style.popup : ''}
+        style={{ display: isThinConsentToolShowing ? 'flex' : 'none' }}
+      >
+        {config.blockBrowsing &&
+          <div
+            class={style.overlay}
+            onClick={this.handleClose}
+          />
+        }
+        <div name='content' class={this.state.isActive ? style.contentClicked : style.content}>
+          <Panel selectedIndex={selectedPanelIndex}>
+            <IntroThin
+              onAcceptAll={this.onAcceptAll}
+              onShowPurposes={this.handleShowDetails}
+              onClose={this.handleClose}
+              localization={localization}
+              store={store}
+              config={config}
+              updateCSSPrefs={updateCSSPrefs}
+            />
+            <Details
+              onSave={this.props.onSave}
+              onCancel={this.onCancel}
+              store={this.props.store}
+              onClose={this.handleClose}
+              localization={localization}
+              config={config}
+              updateCSSPrefs={updateCSSPrefs}
+            />
+          </Panel>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/src/components/popup/popupThin.less b/src/components/popup/popupThin.less
new file mode 100644
index 0000000..55c16a5
--- /dev/null
+++ b/src/components/popup/popupThin.less
@@ -0,0 +1,55 @@
+@import '../../style/variables';
+
+.popup {
+  display: none;
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 99999;
+  justify-content: center;
+  align-items: center;
+}
+.overlay {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+.content {
+    left: 0;
+    right: 0;
+    bottom: 0;
+  background: white;
+  position: fixed;
+  background-color: white;
+  box-shadow: 0px 0px 0px 3px @color-primary;
+
+  @media @smartphone {
+    width: 98%;
+    height: 98%;
+  }
+}
+
+.contentClicked {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 700px;
+  height: 500px;
+  background: white;
+  display: flex;
+  align-items: center;
+  background-color: white;
+  box-shadow: 0px 0px 0px 3px @color-primary;
+
+  @media @smartphone {
+    width: 98%;
+    height: 98%;
+  }
+}
diff --git a/src/lambdaFunction.js b/src/lambdaFunction.js
new file mode 100644
index 0000000..39b487f
--- /dev/null
+++ b/src/lambdaFunction.js
@@ -0,0 +1,144 @@
+const VENDOR_COOKIE_NAME = "euconsent";
+const GDPR_COUNTRIES = new Set([
+	"GB",
+	"DE",
+	"PL",
+	"FR",
+	"ES",
+	"NO",
+	"IT",
+	"IS",
+	"RO",
+	"SE",
+	"BG",
+	"GR",
+	"NL",
+	"HR",
+	"IE",
+	"CH",
+	"CZ",
+	"AT",
+	"HU",
+	"FI",
+	"DK",
+	"BE",
+	"LI",
+	"PT",
+	"MT",
+	"LU",
+	"CY",
+	"LT",
+	"SK",
+	"SI",
+	"EE",
+	"LV"
+]);
+
+function parseCookies(headers) {
+	const parsedCookie = {};
+	if (headers.cookie) {
+		headers.cookie[0].value.split(';').forEach((cookie) => {
+			if (cookie) {
+				const parts = cookie.split('=');
+				parsedCookie[parts[0].trim()] = parts[1].trim();
+			}
+		});
+	}
+	return parsedCookie;
+}
+
+function parseQueryString(string) {
+	const parsedQueryString = {};
+	if (string) {
+		string.split('&').forEach((param) => {
+			if (param) {
+				const parts = param.split('=');
+				parsedQueryString[parts[0].trim()] = parts[1].trim();
+			}
+		});
+	}
+	return parsedQueryString;
+}
+
+function containsMacros(queryString) {
+	return /(\{gdpr\}|\{gdpr_consent\})/.test(queryString);
+}
+
+function performMacroSubstitution(queryString, gdprApplies, consentString) {
+	queryString = decodeURIComponent(queryString);
+	queryString = queryString.replace(/\{gdpr\}/, gdprApplies);
+	queryString = queryString.replace(/\{gdpr_consent\}/, consentString);
+	return queryString;
+}
+
+function encodeQueryString(gdprApplies, consentString, addParms, redirectContainsMacros) {
+	if ( (addParms && addParms === '1') || !redirectContainsMacros ) {
+		return `?gdpr=${gdprApplies}&gdpr_consent=${consentString}`;
+	}
+}
+
+exports.handler = (event, context, callback) => {
+	const request = event.Records[0].cf.request;
+	const headers = request.headers;
+	const queryString = request.querystring;
+	const parsedCookies = parseCookies(headers);
+	const parsedQueryString = parseQueryString(queryString);
+
+	let origin = '';
+	if (headers['origin'] && (headers['origin'].length > 0)) {
+		origin = headers['origin'][0]['value'];
+	}
+
+	let countryCode = '';
+	if (headers['cloudfront-viewer-country'] && (headers['cloudfront-viewer-country'].length > 0)) {
+		countryCode = headers['cloudfront-viewer-country'][0].value.toUpperCase();
+	}
+
+	const gdprApplies = parsedQueryString.gdpr === '1' || GDPR_COUNTRIES.has(countryCode) ? 1 : 0;
+	const consentString = parsedCookies[VENDOR_COOKIE_NAME];
+
+	let response;
+	if (!parsedQueryString.redirect) {
+		response = {
+			status: '200',
+			statusDescription: 'OK',
+			headers: {
+				'access-control-allow-credentials': [{
+					key: 'Access-Control-Allow-Credentials',
+					value: 'true'
+				}],
+				'access-control-allow-methods': [{
+					key: 'Access-Control-Allow-Methods',
+					value: 'GET, OPTIONS'
+				}],
+				'access-control-allow-origin': [{
+					key: 'Access-Control-Allow-Origin',
+					value: origin
+				}],
+				'content-type': [{
+					key: 'Content-Type',
+					value: 'application/json'
+				}],
+			},
+			body: JSON.stringify({
+				gdpr: gdprApplies,
+				gdpr_consent: consentString,
+			})
+		};
+	} else {
+		const redirectContainsMacros = containsMacros(parsedQueryString.redirect);
+		response = {
+			status: '302',
+			statusDescription: 'Found',
+			headers: {
+				location: [{
+					key: 'Location',
+					value: performMacroSubstitution(parsedQueryString.redirect, gdprApplies, consentString) +
+					encodeQueryString(gdprApplies, consentString, parsedQueryString.add_parms, redirectContainsMacros),
+				}]
+			}
+		};
+	}
+
+	callback(null, response);
+};
diff --git a/src/lib/cmp.js b/src/lib/cmp.js
index 18d69bc..5730894 100644
--- a/src/lib/cmp.js
+++ b/src/lib/cmp.js
@@ -221,10 +221,25 @@ export default class Cmp {
 		 * Trigger the consent tool UI to be shown
 		 */
 		showConsentTool: (_, callback = () => {}) => {
-			const _command = this.config.layout === 'footer' ? 'toggleFooterConsentToolShowing' : 'toggleConsentToolShowing';
+			let _command;
+			switch (this.config.layout) {
+				case 'footer':
+					_command = 'toggleFooterConsentToolShowing';
+					break;
+				case 'thin':
+					_command = 'toggleThinConsentToolShowing';
+					break;
+				default:
+					_command = 'toggleConsentToolShowing';
+			}
+
 			this.cmpShown = true;
 			this.store[_command](true);
 			callback(true);
+		},
+
+		getConfig: (_, callback = () => {}) => {
+			callback(this.config.copy(), true);
 		}
 	};
 
diff --git a/src/lib/cmp.test.js b/src/lib/cmp.test.js
index d70c917..c33fc9b 100644
--- a/src/lib/cmp.test.js
+++ b/src/lib/cmp.test.js
@@ -70,7 +70,8 @@ describe('cmp', () => {
 			noConsentGiven: 1
 		},
 		geoIPVendor: 'http://cmp.digitru.st/geoip.json',
-		storeConsentGlobally: false
+		storeConsentGlobally: false,
+		copy: jest.fn().mockReturnValue('copy')
 	};
 
 	beforeEach(() => {
@@ -219,6 +220,13 @@ describe('cmp', () => {
 			});
 		});
 
+		it('getConfig', (done) => {
+			cmp.processCommand('getConfig', null, response => {
+				expect(response).to.equal('copy');
+				done();
+			});
+		});
+
 		describe('addEventListener', () => {
 
 			it('only adds the callback instance once', () => {
diff --git a/src/lib/config.js b/src/lib/config.js
index 2b30d48..7d9bc5b 100644
--- a/src/lib/config.js
+++ b/src/lib/config.js
@@ -82,6 +82,17 @@ class Config {
 
 		}
 	};
+
+	copy = () => {
+		return Object.keys(defaultConfig).reduce((result, key) => {
+			if (typeof defaultConfig[key] === 'object' && defaultConfig[key] !== null) {
+				result[key] = Object.assign({}, this[key]);
+			} else {
+				result[key] = this[key];
+			}
+			return result;
+		}, {});
+	};
 }
 
 export default new Config();
diff --git a/src/lib/config.test.js b/src/lib/config.test.js
index fed4f75..2af45b2 100644
--- a/src/lib/config.test.js
+++ b/src/lib/config.test.js
@@ -2,7 +2,6 @@ import { expect } from 'chai';
 import config from './config';
 
 describe('config', () => {
-
 	it('updates nested config props', () => {
 		expect(config.css['font-family']).to.equal("'Helvetica Neue', Helvetica, Arial, sans-serif");
 		expect(config.css['color-primary']).to.equal('#0a82be');
@@ -12,4 +11,15 @@ describe('config', () => {
 		config.update({ digitrust: { some: 'prop' }});
 		expect(config.digitrust.redirects).to.be.false;
 	});
+
+	it('.copy returns new object containing config values', () => {
+		const copy = config.copy();
+		expect(copy.constructor).to.not.equal(config.constructor);
+		expect(Object.keys(copy)).to.be.deep.equal(Object.keys(config).filter((key) => {
+			return ! { update: true, copy: true, individualOverwritesAllowed: true }[key];
+		}));
+		Object.keys(copy).forEach((key) => {
+			expect(copy[key]).to.be.deep.equal(config[key]);
+		});
+	});
 });
diff --git a/src/lib/store.js b/src/lib/store.js
index 7514ed3..0327e69 100644
--- a/src/lib/store.js
+++ b/src/lib/store.js
@@ -364,13 +364,23 @@ export default class Store {
 		this.isFooterConsentToolShowing = typeof isShown === 'boolean' ? isShown : !this.isConsentToolShowing;
 		this.isFooterShowing = false;
 		this.isConsentToolShowing = false;
+		this.isThinConsentToolShowing = false;
 		this.storeUpdate();
 	};
 
+	toggleThinConsentToolShowing = (isShown) => {
+		this.isThinConsentToolShowing = typeof isShown === 'boolean' ? isShown : !this.isConsentToolShowing;
+		this.isFooterShowing = false;
+		this.isConsentToolShowing = false;
+		this.isFooterConsentToolShowing = false;
+		this.storeUpdate();
+	}
+
 	toggleConsentToolShowing = (isShown) => {
 		this.isConsentToolShowing = typeof isShown === 'boolean' ? isShown : !this.isConsentToolShowing;
 		this.isFooterShowing = false;
 		this.isFooterConsentToolShowing = false;
+		this.isThinConsentToolShowing = false;
 		this.storeUpdate();
 	};
 
@@ -378,6 +388,7 @@ export default class Store {
 		this.isFooterShowing = typeof isShown === 'boolean' ? isShown : !this.isFooterShowing;
 		this.isConsentToolShowing = false;
 		this.isFooterConsentToolShowing = false;
+		this.isThinConsentToolShowing = false;
 		this.storeUpdate();
 	};