body {
  margin: 0;
}
a {
    text-decoration: unset;
    color: white;
}
.mysname{display:none;
/*
margin-top:40px;position:static;
*/
}
.item > .content {min-height:135px;max-height:1440px;/*    padding-top: 20%;*/}  
.outd,.inpd,.cored{top:95%;position:relative;font-size:large;font-weight:bolder;}
h2.outd,
.outd
{text-align:right;margin-right:35%;}
.outd{margin-right:33%;}
h2.inpd,
.inpd
{text-align:left;margin-left:50%;}
h2.cored,
.cored
{  padding-left: 20%;
text-align:center;}
.accordion{margin:auto;overflow: hidden;max-height:1440px;max-width:2560px;min-height:400px;min-width:170px;}
.named{display:contents;}

@media (min-height: 401x) {body{overflow:hidden;}}
@media (max-height: 400px) {
	body{overflow:scroll;}
}
@media (min-width: 1800px) {
	.outd{margin-right:50%;}
}
@media (min-width: 1900px) {
h2{font-size:4em !important;}
.accordion{  flex-direction: row;}
}
.outd{/*
margin-right:50%;
*/}
.text-block {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 20px); /* Вычитаем padding */
  background: rgba(255, 255, 255, 0.5);
  color: white;
  text-align: center;
  padding: 10px;
  z-index: 2; /* Повышаем уровень, чтобы текст был виден над всеми другими слоями */
}

/* В предоставленном CSS медиазапросы не влияют на .text-block, их там нет */

/*
@media (max-width: 1200px) {
h2{font-size:2.35em !important;}
h2.outd{    margin-left: 20%;}
h2.inpd{    margin-right: -10%;}
}
* /
@media (min-width: 600px) {
	*/
@media (min-width: 768px) {
.accordion{  flex-direction: row;}
  .item {
    transform: skewX(10deg);
  }
  .content {
    transform: skewX(-10deg);
  }
  
  div.content h1 {
/*
    transform: rotate(-75deg);
*/
  }
}
.named, h1, h2 {
  color: #fff;
  font-size: 1.8em;
/*  transform: rotate(-90deg); */
  font-family: monospace;
  text-align: center;
  line-height: 1;
  justify-content: center;
  text-transform: uppercase;
  top: 95%;
  position: relative;
margin:0px;
padding:0px;}
/*
h2.outd {
    padding-left: 0;
	margin-left:-15%;
}
*/
section{
	height:100vh;
	min-height:100%;
	}
.d-flex.justify-content-center {
    top: 30px;
    position: absolute;
    right: 30%
	}
img{width:65%;}
.item > .content {
/*    padding-top: 33%;
    padding-bottom: 1%;
*/
height:100vh;
}

.accordion {
  display: flex;
  align-items: stretch;
/*  flex-direction: row;*/
  height: 100vh;
}

.item {
  flex: 1;
  transition: 0.4s;
  margin-left: -50px;
  overflow: hidden;
min-width:42%;/*  display: block;*/
}


/*
div.item:hover,
div.item:focus {
  flex: 5;
}

div.item:hover h1,
div.item:focus h1,
div.item:hover h2,
div.item:focus h2{
  opacity: 0;
  transition: 100ms;
}

div.item:hover div,
div.item:focus div{
  opacity: 1;
  transition: 100ms;
}
*/
.item:first-child {
/*  border-left: 0;
  flex: 1.25;
*/  margin-left: -12em;
  padding-left: 5em;
}

.item:last-child {
/*  flex: 1.25;
*/
  margin-right: -12em;
  padding-right: 5em;
}

.content {
/*  padding-top: 100%;
  padding-right: 0;
  padding-bottom: 0;
*  padding-left: 4em;*/
  padding:0;
  background-position: 75% 65%;
  background-size: cover;
  margin-top: 0em;
  margin-right: -5em;
  margin-bottom: 0em;
  margin-left: -10em;
  flex: 1;
  display: block;
  justify-content: center;
}

.bg1 {
  background-image: url("../fil/2.jpg");
 /*   padding-top: 95%;
    padding-bottom: 5%;
*/	}

.bg2 {
  background-image: url("../fil/0.jpg");
/*    padding-top: 95%;
    padding-bottom: 5%;
*/	}
.bg3 {
  background-image: url("../fil/3.jpg");
/*    padding-top: 95%;
    padding-bottom: 5%;
*/	}
.text {
  top:0;
  left:0;
  width:100%;
  height:100%
}

/*
@media (max-width: 599px) {
*/
@media (max-width: 767px) {
  .accordion {
    flex-direction: column;
  }

  .item.bn2 {
    order: -1;
  }

  .item > .content {
    height: 34vh;
    margin-bottom: 37px; /* Добавляется отступ снизу, чтобы блок .cored имел отступ от нижней границы */
margin-left:0px;
margin-right:0px;  }

  .item.bn2 > .content > .cored {
    position: absolute; /* Абсолютное позиционирование для фиксации позиции внутри .content */
    bottom: -37px; /* Отрицательный отступ, чтобы поднять блок .cored на 37px вверх от нижней границы .content */
    left: 50%;
    transform: translateX(-50%);
    width: 100%; /* Ширина 100% заставит текст выровняться по центру блока */
    text-align: center; /* Текст выравнивается по центру горизонтали */
  }

  .d-flex.justify-content-center {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 150px; /* Размер логотипа */
    height: auto;
  }

  .item {
    margin: 0px !important;
    padding: 0px !important;
  }
.inpd,.outd{text-align:center;margin:0px;}
.outd, .inpd, .cored {top:85%;}
h2.cored, .cored{padding-left:0px;}
}
