Модальное окно (простое)

Требуется только jQuery.
HTML:

<div class="show-popup">Показать окно</div>
<div class="lite-popup-wrapper">
  <div class="fon"></div>
  <div class="popup">
    <div class="popup-content">Содержимое</div>
    <div class="closeblock">+</div>
  </div>
</div>

<div class="show-popup">Показать окно</div>

<div class="popup-content">Содержимое</div>

</div>

CSS:

.show-popup {
cursor: pointer
}
.lite-popup-wrapper {
display:none;
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
z-index: 999;
}
.lite-popup-wrapper .fon {
background: rgba(0, 0, 0, 0.8);
position:fixed;
width:100%;
height:100%;
}
.lite-popup-wrapper .closeblock {
cursor: pointer;
position: absolute;
line-height: 44px;
font-size: 44px;
transform: rotate(45deg);
text-align: center;
top: 0;
right: 12px;
color: #333;
}
.lite-popup-wrapper .closeblock:hover {
color: #000;
}
.lite-popup-wrapper .popup {
position: relative;
width: 400px;
max-width: 100%;
padding: 40px 0 20px;
background: #00aeef;
color: #fff;
text-align: center;
font-size: 14px;
top: 50vh;
margin: -38px auto; // половина высоты окна
}
.lite-popup-wrapper .popup .popup-content {
padding: 0 15px;
}
/* Эти стили нужны, только если в окне будет форма */
.lite-popup-wrapper .popup textarea,
.lite-popup-wrapper .popup input[type='text'],
.lite-popup-wrapper .popup input[type='email'] {
border:0;
font:14px;
background:#fff;
padding:10px;
width:100%;
color:#000;
}
.popupform input[type='submit']{
cursor:pointer;
padding:5px 10px;
color:#000;
}

.show-popup {

cursor: pointer

}

.lite-popup-wrapper {

display:none;

position:fixed;

left:0;

top:0;

width:100%;

height:100%;

z-index: 999;

}

.lite-popup-wrapper .fon {

background: rgba(0, 0, 0, 0.8);

position:fixed;

width:100%;

height:100%;

}

.lite-popup-wrapper .closeblock {

cursor: pointer;

position: absolute;

line-height: 44px;

font-size: 44px;

transform: rotate(45deg);

text-align: center;

top: 0;

right: 12px;

color: #333;

}

.lite-popup-wrapper .closeblock:hover {

color: #000;

}

.lite-popup-wrapper .popup {

position: relative;

width: 400px;

max-width: 100%;

padding: 40px 0 20px;

background: #00aeef;

color: #fff;

text-align: center;

font-size: 14px;

top: 50vh;

margin: -38px auto; // половина высоты окна

}

.lite-popup-wrapper .popup .popup-content {

padding: 0 15px;

}

/* Эти стили нужны, только если в окне будет форма */

.lite-popup-wrapper .popup textarea,

.lite-popup-wrapper .popup input[type='text'],

.lite-popup-wrapper .popup input[type='email'] {

border:0;

font:14px;

background:#fff;

padding:10px;

width:100%;

color:#000;

}

.popupform input[type='submit']{

cursor:pointer;

padding:5px 10px;

color:#000;

}

JS:

$('.show-popup').on('click', function(){
$('.lite-popup-wrapper').show();
});
$('.closeblock').on('click', function(){
$('.lite-popup-wrapper').hide();
});

$('.show-popup').on('click', function(){

$('.lite-popup-wrapper').show();

});

$('.closeblock').on('click', function(){

$('.lite-popup-wrapper').hide();

});