Всплывающее окно

<a href="javascript://" onclick="$('.okno, .bg-body').fadeToggle(1000);">О нас</a>

<div class="bg-body"></div><div class="okno"><div class="fon"><a href="javascript://" onclick="$('.okno, .bg-body').fadeToggle(1000);" title="Закрыть окно" style="text-decoration:none; outline:none;"><div class="close"></div></a></div><div class="body"><div>Ваш текст</div></div><div class="foother"><a href="javascript://" onclick="$('.okno, .bg-body').fadeToggle(1000);" style="text-decoration:none; outline:none;"><span class="zakrit">Закрыть</span></a></div> </div>

.bg-body {background: rgba(0,0,0,0.7); width:100%; height:100%; position:fixed; left: 0px; top: 0px; z-index:999; display:none;} .okno {background:#fff; position:fixed; top:10%; left:30%; z-index:1000; width:500px; height:auto; border-radius:7px; box-shadow: 0 0 10px 1px rgba(0,0,0,0.3); display:none;} .fon {background: url(ссылка на картику) 0px 0px no-repeat; background-size: 100%; border-top-left-radius:7px; border-top-right-radius:7px; width:500px; height:140px;} .close {background: url(ссылка на значек закрыть) 0px 0px no-repeat; width:24px; height:24px; float:right; margin:10px 10px 0 0; opacity: 0.5;} .close:hover {opacity: 1.0; cursor:pointer;}   .body {background:#fff; width:500px; height:auto;}   .body div {padding:20px 20px; text-align:justify; line-height:1.8;} .foother {background:#f3f3f3; width:460px; height:auto; padding:20px; border-bottom-left-radius:7px; border-bottom-right-radius:7px; text-align:center;} .zakrit {background:#6bb933; border-radius:20px; color:#fff; font-size:14px;top: 40px; text-shadow:0 -1px 0 rgba(0, 0, 0, .2); text-align:center; box-shadow: 0 1px 1px rgba(0, 0, 0, .1); padding:8px 30px; opacity: 0.8;} .akrit:hover {opacity: 1.0;}