@charset "utf-8";
/* CSS Document */
body{margin:0;padding:0}
body{font:100% arial,sans-serif}
.my_boks {
 float:left;
    position: relative;
   width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0;
    text-align: center;
}
.my_boks1 {
  display: inline-block;
   vertical-align: top;
   overflow: hidden;
 margin: 5px;
 margin-left: 5px;
 padding: 1px 1px;
 width: calc(24% - 24px);
height: 220px;
width: 180px;
box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
text-align: top;
}
.my_boks2 {
  display: inline-block;
   vertical-align: top;
   overflow: hidden;
 margin: 5px;
 margin-left: 5px;
 padding: 1px 1px;
 width: calc(24% - 24px);
max-height: 350px;
max-width: 250px;
width: 220px;
height: auto;
box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
text-align: top;
}
.my_boks5 {
 right: 0;
  margin: 0px;
 padding: 0px 0px;
 width:100%;
 background: rgba(255, 255, 255, 0.5);
 box-sizing: border-box;
 box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
}
.my_boks5 { background: rgba(255, 255, 255, 0.5); border: #3320D9; }figcaption {
    text-align: top;
   }
   .buttonup {
width:70px; 
height:98px;
position:fixed;
bottom:3px;
right:3px;
}
.my_boks6 {
  display: inline-block;
   vertical-align: top;
   overflow: hidden;
 margin: 5px;
 margin-left: 3px;
 padding: 1px 1px;
 width: 15%;
box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
text-align: top;
}
 .my_boks3 {
  display: inline-block;
 margin: 10px;
 margin-left: 10px;
 padding: 1px 1px;
 width:100%;
box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
text-align: top;
    
}
.my_boks0 {
  display: inline-block;
 margin: 1px;
 padding: 5px 5px;
 width:98%;
 box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
 overflow:hidden;
  text-align: left;
 color: #190361;
font-size:1.3vw
}
.my_boks {
  float:left;
    position: relative;
    width: 100%; 
    display: block;
    margin: 0 auto;
    padding: 0;
}
.image {

 overflow:hidden;
 margin:0; 
font-size:1.4vw
    
}

img[tabindex="0"] {  
  cursor: zoom-in;  
 width: 100%; /* Ширина изображений */
 
   }  
img[tabindex="0"]:focus {  
  position: fixed; z-index: 10;  
  top: 0; left: 0; bottom: 0; right: 0;  
  width: auto; max-width: 100%;  
  height: auto; max-height: 100%;  
  margin: auto;  
 box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
 background: rgba(255, 255, 255, 0.5); border: #3320D9;
}  
img[tabindex="0"]:focus, /* Привязка на возврат фото в привычное состояние после клика на увеличенное */  
img[tabindex="0"]:focus ~ * {  
  cursor: zoom-out;  
  pointer-events: none;  
}
 .blockq {
 padding: 30px 30px 30px 30px;
 color: #15034E;
font-size:1.3vw
 }
 .tek {
 text-decoration: none;
 margin-left: 10px;
 color: #15034E;
 
 }
 .half {
  float: left;
  width: 100%;
  padding: 0 1em;
  box-sizing: border-box;box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
background: rgba(255, 255, 255, 0.5); border: #3320D9;
}
h2 {
   text-decoration: none;
  color: #15034E;/* цвет текста */ 
  margin-left: 10px;
   text-align: center;
 font-size:2.0vw /* размер текста */
}