<div>
<!-- Div to select elements inside -->

<div id="editorTpl">
		<div class="upfront_code-editor-complex-wrapper">
			<div class="upfront-css-top ui-resizable-handle ui-resizable-n">
				<div class="upfront_code-switches">
					<div class="upfront_code-switch active" data-for="markup">{{ l10n.html }}</div>
					<div class="upfront_code-switch" data-for="style">{{ l10n.css }}</div>
					<div class="upfront_code-switch" data-for="script">{{ l10n.js }}</div>
				</div>
				<a class="upfront-css-theme_image upfront-css-image" href="#">{{ l10n.link_theme_image }}</a>
				<a class="upfront-css-media_image upfront-css-image" href="#">{{ l10n.link_image }}</a>
				<div class="upfront-css-color"></div>
				<div class="upfront_code-jsalert error javascript"><i class="upfront-icon-button" title="{{ l10n.code_error }}"></i></div>
				<a class="upfront-css-close" href="#">{{ l10n.close }}</a>
			</div>
			<div class="upfront-css-body">
				<div class="upfront_code-editor-section upfront_code-markup active">
					<div class="upfront_code-ace" data-type="markup" >{{markup}}</div>
				</div>
				<div class="upfront_code-editor-section upfront_code-style">
					<div class="upfront_code-ace" data-type="style" >{{style}}</div>
				</div>
				<div class="upfront_code-editor-section upfront_code-script">
					<div class="upfront_code-ace" data-type="script" >{{script}}</div>
				</div>
				<button>{{ l10n.save }}</button>
			</div>
		</div>
</div>

<div id="embedTpl">
	<section class="upfront_code-editor-simple">
		<h3>{{ l10n.paste_your_code }}</h3>
		<textarea class="upfront_code-markup" data-type="markup">{{ markup }}</textarea>
		<button>{{ l10n.save }}</button>
	</section>
</div>

</div>