<!--HTML-->
<script src="https://forumstatic.ru/files/0014/fb/ba/20778.js"></script>
<style>
 #foton {width: 348px; height: 467px; z-index: 200; background: #b8d4ef; opacity: 0.7; display: none;}
 .fonfon {width: 348px; height: 467px; position: absolute;        }
 #fonimg {  background-image: url("https://forumstatic.ru/files/0014/fb/ba/20977.png");  }
#botanical {position: absolute; width: 100px; height: 76px; cursor: pointer; top: 375px; left: 8px;}
.hospital {background-image: url(https://forumstatic.ru/files/0014/fb/ba/66742.png); position: absolute; left: 77px; top: 279px; width: 90px; height: 58px; z-index: 10; cursor: pointer; filter: grayscale(100%);}
.aquarium {background-image: url(https://forumstatic.ru/files/0014/fb/ba/87861.png); position: absolute; left: 191px; top: 216px; width: 75px; height: 58px; z-index: 8; cursor: pointer; filter: grayscale(100%);}
.cinema {background-image: url(https://forumstatic.ru/files/0014/fb/ba/20154.png); position: absolute; left: 59px; top: 190px; width: 98px; height: 60px; z-index: 6; cursor: pointer; filter: grayscale(100%);}
.island {background-image: url(https://forumstatic.ru/files/0014/fb/ba/30495.png); position: absolute; left: 123px; top: 65px; width: 86px; height: 78px; z-index: 2; cursor: pointer; filter: grayscale(100%);}
.bridge {background-image: url(https://forumstatic.ru/files/0014/fb/ba/69853.png); position: absolute; left: 217px; top: 20px; width: 102px; height: 58px; z-index: 4; cursor: pointer; filter: grayscale(100%);}
.etookno {position: absolute; top: 40px; left: 30px; width: 285px; z-index: 1000; height: 390px; background-color: #f6f6f6; border-radius: 10px; border-color: #b3c6d9; border-style: dotted; border-width: 1px; box-shadow: inset 0 0 7px #3d71a5, 0 0 7px #92b1d0;}
.oknotitle {    position: absolute;    text-align: center;    top: 3px;    width: 284px;    font-family: 'bebas neue';    color: rgba(218, 237, 255, 0.75);    font-size: 25px;    text-shadow: 1px 1px 1px rgba(101, 119, 152, 0.68), 0px -1px 1px #f3f5fb;}
  #hospital {position: absolute; width: 117px; height: 76px; top: 272px; left: 64px; cursor: pointer;  z-index: 200; }
  #aquarium {position: absolute; width: 98px; height: 76px; top: 210px; left: 187px; cursor: pointer; z-index: 200;}
#cinema {position: absolute; width: 95px; height: 76px; top: 184px; left: 44px; cursor: pointer; z-index: 200;}
#island {position: absolute; width: 84px; height: 88px; top: 65px; left: 130px; cursor: pointer; z-index: 200;} 
#bridge  {position: absolute; width: 112px; height: 76px; top: 11px; left: 214px; cursor: pointer; z-index: 200;}
#ls_fon {position:relative; width:800px; height:600px; background: url(https://forumstatic.ru/files/0014/fb/ba/80721.png);}
#ls_photo {border-style: solid; border-width: 3px;  border-color: rgb(101, 172, 208); border-radius: 50%;  background-color: rgb(100, 172, 207);  position: absolute;  left: 165px;  top: 201px;  width: 99px;  height: 98px; background-position: 50% !important;}
#ls_namesur {font-size: 18px; font-family: Bebas Neue; color: rgb(94, 98, 100); line-height: 1.125; text-align: center; position: absolute; left: 122.55px; top: 316.953px; width: 188px; height: 15px; z-index: 80; text-align: center; text-shadow: 0px 1px 0px #eeedea; font-weight: bold;
    font-style: italic;}
#ls_prof {font-size: 10px; font-family: roboto; color: rgb(0, 0, 0); line-height: 1.2; text-align: center; position: absolute; left: 116.339px; top: 338.418px; width: 203px; height: 29px; z-index: 79; text-align: center;}
#ls_postov {font-size: 18px; font-family: Bebas Neue; color: rgb(46, 127, 181); line-height: 0.889; position: absolute; left: 160px; top: 384px; z-index: 84; font-weight: 900; text-shadow: 0px 0px 6px #8bbfda; width: 54px; text-align: center;}
#ls_miles {font-size: 18px; font-family: Bebas Neue; color: rgb(46, 127, 181); line-height: 0.889; position: absolute; left: 220px; top: 384px; z-index: 84; font-weight: 900; text-shadow: 0px 0px 6px #8bbfda; width: 54px; text-align: center;}
</style>

 <script type="text/javascript">
$(document).ready(function(){
        $("#hospit").hide();
        $("#botanica").hide();
        $("#aquar").hide();
        $("#cinem").hide();
        $("#isl").hide();
        $("#brid").hide();

        
           $( "#foton").click(function() {
          $("#hospit").hide();
        $("#botanica").hide();
        $("#aquar").hide();
        $("#cinem").hide();
        $("#isl").hide();
        $("#brid").hide();
        $("#foton").fadeOut(1000);  
        });
        
           
        $( "#hospital").click(function() {
          $("#hospit").fadeIn(1000);
          $("#foton").show();  
        });

        $( "#botanical").click(function() {
          $("#botanica").fadeIn(1000);
          $("#foton").show();  
        });
        
        $( "#aquarium").click(function() {
          $("#aquar").fadeIn(1000);
          $("#foton").show();  
        });

        $( "#cinema").click(function() {
          $("#cinem").fadeIn(1000);
          $("#foton").show();  
        });

        $( "#island").click(function() {
          $("#isl").fadeIn(1000);
          $("#foton").show();  
        });

        $( "#bridge").click(function() {
          $("#brid").fadeIn(1000);
          $("#foton").show();  
        });



        });
        </script>

<center><div id="ls_fon">


<div id="ls_photo" style="background: url(

http://via.placeholder.com/150x150


);"></div>

<!--ИМЯ ФАМИЛИЯ И ВОЗРАСТ ПЕРСОНАЖА-->
<div id="ls_namesur">

имя фамилия, 00

</div>

<!--ИНФА О ПЕРСЕ-->

<div id="ls_prof">профессия</div>

<!--ПОСТЫ-->
<div id="ls_postov">000</div>

<!--МИЛИ-->
<div id="ls_miles">000</div>

 <div class="ls_buttons_wrapper2">
            <div class="ls_buttons2" id="ls_buttons2_first"></div>
            <div class="ls_buttons2" id="ls_buttons2_second"></div>
            <div class="ls_buttons2" id="ls_buttons2_third"></div>
            <div class="ls_buttons2" id="ls_buttons2_fourth"></div>
            <div class="ls_buttons2" id="ls_buttons2_fifth"></div>
            </div>

<div class="ls_info_wrap" id="ls_gen_info1" style="background: url(

https://i.imgur.com/IJyOsaA.png


);"></div>
<div class="ls_info_wrap" style="display:none;" id="ls_gen_info2" >


      <div id="foton" class="fonfon"></div>
     <div id="fonimg" class="fonfon">

<div class="botanical"></div>
<div class="hospital"></div>
<div class="aquarium"></div>
<div class="cinema"></div>
<div class="island"></div>
<div class="bridge"></div>




 <div id="botanical"></div>
 <div id="hospital"></div>
 <div id="aquarium"></div>
 <div id="cinema"></div>
 <div id="island"></div>
 <div id="bridge"></div>




<!--окно ботанический сад-->
 <div class="etookno" id="botanica"> <div class="oknotitle">ботанический сад</div> </div>
              
         <!--окно больнички-->
        <div class="etookno" id="hospit">   <div class="oknotitle">Госпиталь</div> </div>

<!--окно аквариум-->
<div class="etookno" id="aquar"> <div class="oknotitle">Аквариум</div> </div>

         <!--окно кинотеатр-->
        <div class="etookno" id="cinem">   <div class="oknotitle">Кинотеатр</div> </div>

<!--окно остров-->
 <div class="etookno" id="isl"> <div class="oknotitle">Какой-то остров</div> </div>

        <!--окно мост-->
        <div class="etookno" id="brid">   <div class="oknotitle">Мост</div> </div>

</div>
            </div>
            <div class="ls_info_wrap" id="ls_gen_info3" style="display:none;">
             <div style="font-size: 15px;
    font-family: Neucha;
    color: rgb(125, 109, 109);
    line-height: 1.067;
    text-align: left;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.004);
    position: absolute;
    left: 16.535px;
    top: 41.535px;
    width: 166px;
    height: 113px;
    z-index: 113;
">- освоиться на Манхеттене
<br> - побывать и сделать фото у статуи свободы

<br> - увидеть знаменитость
<br> 
-  загадать желание на таймс сквер
<br> 
-  избежать пробку</div></div>
            <div class="ls_info_wrap" id="ls_gen_info4" style="display:none;">      
            <div style="position: absolute; left: 4px;  top: 18px; width: 242px; height: 176px; z-index: 88; overflow: auto;"><img src="https://i.imgur.com/10OwHeP.png"></div>
<div style="position: absolute; left: 16px; top: 234px; width: 322px; height: 217px; z-index: 89; overflow: auto;"><img src="http://funkyimg.com/i/2xUSq.png" title="житель Нью-Йорка">
<img src="http://funkyimg.com/i/2xV7X.png" title="первый пост">
<img src="http://funkyimg.com/i/2xUMX.png" title="20 постов">
<img src="http://funkyimg.com/i/2xUSo.png" title="50 постов">
<img src="http://funkyimg.com/i/2xUSS.png" title="30 постов в тиндере">
<img src="http://funkyimg.com/i/2xUM4.png" title="написать пост на 15 тыс. символов">
<img src="http://funkyimg.com/i/2xUSB.png" title="3 поста в сутки">
<img src="http://funkyimg.com/i/2xUMZ.png" title="активист недели">
<img src="http://funkyimg.com/i/2xUMY.png" title="300 сообщений за сутки">
<img src="http://funkyimg.com/i/2xUSC.png" title="500 сообщений в профиле">
<img src="http://funkyimg.com/i/2xUSY.png" title="2000 сообщений в профиле">
<img src="http://funkyimg.com/i/2xV7V.png" title="5000 сообщений в профиле ">
<img src="http://funkyimg.com/i/2xV7W.png" title="500 в репутации">
<img src="http://funkyimg.com/i/2xV8b.png" title="500 в позитиве">
<img src="http://funkyimg.com/i/2xV8c.png" title="ведение темы творчества [не менее 25 постов] ">
<img src="http://funkyimg.com/i/2xV8B.png" title="победа в мафии">
<img src="http://funkyimg.com/i/2xUZ6.png" title="3 отзыва на ТОПЕ">
<img src="http://funkyimg.com/i/2xUZD.png" title="1 месяц на форуме">
<img src="http://funkyimg.com/i/2xUZ8.png" title="3 месяца на форуме">
<img src="http://funkyimg.com/i/2xUZ9.png" title="полгода на форуме">
<img src="http://funkyimg.com/i/2xUZa.png" title="год на форуме">
<img src="http://funkyimg.com/i/2xUZE.png" title="12 часов онлайна">
<img src="http://funkyimg.com/i/2xUZG.png" title="неделя на форуме [сумма пребывания в профиле] ">
<img src="http://funkyimg.com/i/2xUZF.png" title="100 реклам [за один подход]">
<img src="http://funkyimg.com/i/2xUZN.png" title="350 реклам [общее кол-во оставленных реклам] ">
<img src="http://funkyimg.com/i/2xUZP.png" title="15 подарочных аватаров ">
<img src="http://funkyimg.com/i/2xUZQ.png" title="10% на карте">
<img src="http://funkyimg.com/i/2xUZH.png" title="золотая карта">
<img src="http://funkyimg.com/i/2xV2j.png" title="платиновая карта">
<img src="http://funkyimg.com/i/2xV2L.png" title="прошел половину маршрута ">
<img src="http://funkyimg.com/i/2xV3f.png" title="прошел весь маршрут">
<img src="http://funkyimg.com/i/2xVbL.png" title="привел друга [наличие у него 2 постов] ">
<img src="http://funkyimg.com/i/2xVbM.png" title="помощь администрации [выдается амс] ">
<img src="http://funkyimg.com/i/2xVbN.png" title="ведение хронологии и отношений [не менее 5 шт в каждом]">
<img src="http://funkyimg.com/i/2xVbP.png" title="подарил 10 иконок">
<img src="http://funkyimg.com/i/2xVbQ.png" title="подарил 6 плашек">
<img src="http://funkyimg.com/i/2xVbR.png" title="3 заявки в нужных персонажах">
<img src="http://funkyimg.com/i/2xVbS.png" title="2 человека из хочу к вам [начата с ними игра]">
<img src="http://funkyimg.com/i/2xVbT.png" title="исполнить 10 желаний из чужих списков">
<img src="http://funkyimg.com/i/2xVbU.png" title="завершить 2 своих списка">
<img src="http://funkyimg.com/i/2xVbV.png" title="20 комментов в творческой теме">
<img src="http://funkyimg.com/i/2xVbW.png" title="5 отзывов о дизайнах">
<img src="http://funkyimg.com/i/2xVbX.png" title="3 победы в конкурсах">
<img src="http://funkyimg.com/i/2xVbY.png" title="победа в личном зачете">
<img src="http://funkyimg.com/i/2xV2i.png" title="победа в 5 номинациях"></div></div>
<div class="ls_info_wrap" id="ls_gen_info5" style="display:none;">      
            </div>

</div></center>