@font-face {
    font-family: Narrow; /* Гарнитура шрифта */
    src: url(fonts/AGLettericaCondensedC.otf); /* Для IE5-8 */
    src: local(PT_Serif), url(fonts/AGLettericaCondensedC.otf); /* Для остальных браузеров */
   }    
   
@font-face {
    font-family: Narrow; /* Гарнитура шрифта */
    src: url(fonts/AGLettericaCondensedC.otf); /* Для IE5-8 */
    src: local(PT_Serif), url(fonts/AGLettericaCondensedC.otf); /* Для остальных браузеров */
   }  
   
 
 
body{width:100vw; height:100vh; padding:0; margin:0; position:relative; overflow:hidden; } 



#main_text{clear:both; padding-top:3vh;}


.galary_liu {
  display: flex;
  width: 100%;
  padding: 4% 2%;
  margin-bottom:19%;
  box-sizing: border-box;
  height: 44vh;
  font-family:Narrow;
}

.box {
  flex: 1;
  overflow: hidden;
  transition: 0.5s;
  margin: 0 2%;
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1);
  line-height: 0;
}

.box > img {
  width: 200%;
  height: calc(100% - 10vh);
  -o-object-fit: cover;
     object-fit: cover;
  transition: 0.5s;
}

.box > span {
  font-size: 3.8vh;
  display: block;
  text-align: center;
  height: 10vh;
  line-height: 2.6;
}

.box:hover {
  flex: 1 1 50%;
}

.box:hover > img {
  width: 100%;
  height: 100%;
  
} 



.kulka_ciemna{background:#5B6C7E; width:12%; margin-right:3%; margin-bottom:2%; aspect-ratio: 1/1; border-radius:100%; position:relative; float:left;}
.kulka_jasna{background: linear-gradient(45deg, #F2F2F2, #D8D8DB); width:90%; left:5%; top:5%; position:absolute; aspect-ratio: 1/1; border-radius:100%; text-align:center;  display:table;}
.pp{vertical-align:middle; display: table-cell; color:#171D24; font-family:arial;  font-weight:600;  }




	
a {text-decoration: none; /* убирать подчёркивание у ссылок */}	

@media (max-width: 1280px) {
	#desc{display:none;}
	#mobil{display:block;}
	.galary_liu {
 
	height: 60vh;
 
	}

}


@media screen and (orientation: portrait){
	
	
	
	.galary_liu {
 
	height: 20vh;
 
	}
 


	
}