Tutorial: Popup Like Page Facebook 2015 Responsive

<style>
#title-deluxe {
position: absolute;
color: #3B5998;
width: 90%;
height: 10%;
font-size: 20px;
font-weight: bold;
border:5px solid #ddd;
border-radius:2px;
margin-bottom: 15px;
font-family:verdana, geneva;
}
#back-deluxe {
background:rgba(0,0,0,0.6);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#exit-deluxe {
width:100%;
height:100%;
}
#box-deluxe {
background:white;
height:308px;
position:absolute;
top:58%;
left:65%;
margin:-220px 0 0 -375px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 10px;
border: 5px #127ca6 solid;
}
#close-deluxe {
float:right;
cursor:pointer;
background:url(http://i.imgur.com/3gcHIlD.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-deluxe {
height:1px;
width:366px;
margin:0 auto;
margin-top:16px;
position:relative;
margin-left:2px;
}    [MENTION=16931]medi[/MENTION]a screen and (max-width: 800px) {
    #box-deluxe {
        left: 75%;
        
    }
}    [MENTION=16931]medi[/MENTION]a screen and (max-width: 700px) {
    #box-deluxe {
        left: 82%;
        
    }
}    [MENTION=16931]medi[/MENTION]a screen and (max-width: 550px) {
    #box-deluxe {
       display: none;
    }
    
}
</style>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
 
// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
 
if (value === null || value === undefined) {
options.expires = -1;
}
 
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
 
value = String(value);
 
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '',
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
 
// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#back-deluxe').delay(1000).fadeIn('medium');
$('#close-deluxe, #exit-deluxe').click(function(){
$('#back-deluxe').stop().fadeOut('medium');
});
}
[B]$.cookie('popup_user_login', 'yes', { path: '/', expires: 1 });[/B]
});
</script>
<div id='back-deluxe'>
<div id="exit-deluxe">
</div>
<div id="box-deluxe">
<div id='title-deluxe'>Hazte Fan!
</div>
<div id="close-deluxe">
</div>
<div class="remove-deluxe">
</div>
<center>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/es_LA/sdk.js#xfbml=1&version=v2.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<br />
<br />
<br />
<div class="fb-page" data-href="https://www.facebook.com/[B]aquinombredetufanpage[/B]" data-width="402" data-height="255" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/[B]aquinombredetufanpage[/B]"><a href="https://www.facebook.com/[B]aquinombredetufanpage[/B]">[B]aquinombredetufanpage[/B]</a></blockquote></div></div>
</center>
</div>
</div>