.kvest_karta img{ 
  width:140px;
  height:90px;
   padding:5px; 
   }
.leftimg {
    float: left; 
    margin: 0px 0 2px 2px;
}
.rightimg {
    float: right; 
    margin: 0px 0 2px 2px;
}

#t_i {  
   text-shadow: 0px #c1c8c7;
   font-size: 1.2em;   
}
.t_n {
   padding:0 0 5px 20px;
   font-size: 0.9em;
   display: block;
}
.t_b {   
   font-size: 1.1em;
   font-style: bold;
   color: #F5F187;
}
.t_z {
  font-size: 0.9em;
  font-weight: normal;
  text-shadow: 0 0 0 crimson;
   padding:2 0 2 25px;
  color: transparent;
  animation: shadows 4s infinite ease-in;
}
@keyframes shadows {
  60% { text-shadow: 0 0 0 crimson;  }
  90% { text-shadow: 0 30px 40px transparent;  }
  100% { text-shadow: 0 0 0 transparent;  }
}

.mapa_zagol{  
  width:620px;
  top:100px;
  left:100px;
  position: relative;
  padding: 10px;
  text-align: center;
  font-size:32px;
  text-shadow: 6px 6px 0px rgba(0,0,0,0.2);}
.mapa_karta{  
  display: flex;
  width:600px;
  height:360px;
  position: relative;
  box-shadow: inset 0 0 6px;}
.mapa_text{ 
  display: flex;
  width:580px;  
  top:10px;
  position: relative;
  text-decoration: none;
  font-size:16px;
  padding:10px;
  box-shadow: inset 0 0 6px;}


.kvest_zagol{display:block;
  width:800px;
  height:620px;
  top:100px;
  left:100px;
  position: absolute;
  box-shadow: inset 0 0 6px;
  padding: 10px;
  font-size:32px;
  text-shadow: 6px 6px 0px rgba(0,0,0,0.2);}
.nazva{
  padding: 10px;
  b-ox-shadow: inset 0 0 6px;}
.kvest_karta{ 
  width:648px;
  height:453px;
  float: left;
  text-shadow: none;
      font-size: 0.3em;}

.kvest_tabl{  
  width:145px;
  height:453px;
  float: right;
  font-size:15px;
  box-shadow: inset 0 0 6px;
  text-shadow: 0px 0px 0px rgba(0,0,0,0);}  
.kvest_text{  
  width:800px;
  float: left;  
  top:10px;
  position: relative;
  text-decoration: none;
  font-size:16px;
  padding:0px;
  box-shadow: inset 0 0 6px;
  margin-bottom: 0;}
.kvest_text p{
   text-align: center;} 




//====

div#image-1 { left: 0; }
div#image-2 { left: 270px; }
div#image-3 { left: 540px; }
div#image-4 { left: 0; top: 200px;}
div#image-5 { left: 270px;  top: 200px;}
div#image-6 { left: 540px;  top: 200px;}
#images-box {
 / * Общая ширина изображения контейнера, в основном, для центрирования * /
 width: 790px;
 margin: 0px auto;
 position: relative;
 top: 20px;
}

.image-lightbox img {
 width: inherit;
 height: inherit;
 z-index: 3000;
}

.holder {
 / * Ширина и высота, вы можете их изменить * /
 width: 230px;
 height: 166px;
 float: left;
 margin: 0 20px 0 0;
}

.image-lightbox {
width: inherit;
 height: inherit;
 padding: 10px;
 /* Тени */
 box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
 background: #fff;
 border-radius: 5px;
 position: absolute;
 top: 0;
 font-family: Arial, sans-serif;
 /* Переходы */
 -webkit-transition: all ease-in 0.5s;
 -moz-transition: all ease-in 0.5s;
 -ms-transition: all ease-in 0.5s;
 -o-transition: all ease-in 0.5s;
}
.image-lightbox span {
 display: none;
}

.image-lightbox .expand {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 z-index: 4000;
 background: rgba(0,0,0,0); /* Фиксы для IE */
 left: 0;
}

.image-lightbox .close {
 position: absolute;
 width: 20px; height: 20px;
 right: 20px; top: 20px;
}

.image-lightbox .close a {
 height: auto; width: auto;
 padding: 5px 10px;
 color: #fff;
 text-decoration: none;
 background: #22272c;
 box-shadow: inset 0px 24px 20px -15px rgba(255, 255, 255, 0.1), inset 0px 0px 10px rgba(0,0,0,0.4), 0px 0px 30px rgba(255,255,255,0.4);
 border-radius: 5px;
 font-weight: bold;
 float: right;
}

.image-lightbox .close a:hover {
 box-shadow: inset 0px -24px 20px -15px rgba(255, 255, 255, 0.01), inset 0px 0px 10px rgba(0,0,0,0.4), 0px 0px 20px rgba(255,255,255,0.4);
}
#image-1:target, #image-2:target, #image-3:target {
 width: 780px;
 height: 500px;
 z-index: 5000;
 top: 0px;
 left: 0px;
}
#image-4:target, #image-5:target, #image-6:target {
 width: 780px;
 height: 500px;
 z-index: 5000;
 top: 0px;
 left: 0px;
}

div[id^=image]:target .close {
 display: block;
}

div[id^=image]:target .expand {
 display: none;
}

div#image-1:target, div#image-2:target, div#image-3:target, div#image-4:target, div#image-5:target, div#image-6:target { left: 0px; }



