<style>
#editor{
	width:100%;
	height:100%;
	margin:0px;}
.twitter_v{
	border-radius:7px;
	z-index:100;
	width:320px;
	height:320px;
	background-color:#33ccff;
	top:120px;
	position:fixed; 
	right:-320px;}

.facebook_v{
	border-radius:7px; 
	z-index:100;
	width:320px;
	height:320px;
	background-color:#3b5997;
	top:240px;
	position:fixed;
	right:-320px;}
	
	
.socialmedia_cont{
	background-color:#FFF;
	border-radius:7px;
	width:300px;
	height:300px;
	position:relative;
	overflow:hidden;
	margin:10px;}
	
	
.btn_slide{
	cursor:pointer;
	top:0;
	position:absolute;
	left:-30px;}
	


</style>

<div id="editor">
<iframe id="introwebpro" src="http://ayuda.afterfuture.net"></iframe>
<div class="twitter_v">
    <div class="socialmedia_cont">
    
        <a class="twitter-timeline"  href="https://twitter.com/grupowhm"  data-widget-id="361674164286922754">Tweets por @grupowhm</a>
        {literal}<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>{/literal}

    </div>
    <div class="btn_slide"><img src="{$ADMIN_TEMPLATE_DIR}/img/twitter-v.png" /></div>
</div>

<div class="facebook_v">
    <div class="socialmedia_cont">
    
        <iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2FWebHostingEmpresas&amp;width=300&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;show_border=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowTransparency="true"></iframe>    
    
    </div>
    <div class="btn_slide"><img src="{$ADMIN_TEMPLATE_DIR}/img/facebook-v.png" /></div>
</div>


</div>
{literal}
<script>

$(document).ready(function(){
		var widthfull = $('#container').width();
		var heightfull = $('#container').height();
		
		$('#introwebpro').css('width',widthfull);
		$('#introwebpro').css('height',heightfull);
	})

$('.btn_slide').toggle(function(){
	$(this).parent().animate({marginRight:'320px'}, 100);
	$(this).parent().css('z-index','101');
	}, 
	
	function(){
	$(this).parent().animate({marginRight:'0px'}, 100);
	$(this).parent().css('z-index','99');
	});

</script>
{/literal}
