* {
  box-sizing: border-box;
}


div#construction > .content  {
border: 0px solid #eeeeee;
max-width: 1400px;
display: flex;
flex-wrap: wrap;
justify-content:center;
margin:3%;
}



div#construction > h2 {
  font-family: Open Sans, sans-serif;
  font-size: calc(20px + 5 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 400;
  color: #455B66;
  line-height: 105%;
  padding: 1%;
  margin-bottom: -15px;
  text-align: center;
}


div#construction > .content > .item {
    display: flex; 
    border: 0px solid #aaaaff

    background-color: #fff;

    flex-direction: column;
    padding: 1em;
    width: 100%;
    min-width: 400px;
    text-align:center;
    position: relative;   
	perspective: 2000px;
    transform-style: preserve-3d;
}

div#construction > .content > .item > p {
    flex: 1 0 auto;
    margin-top:5px;
}

div#construction > .content > .item > img {
  width: 100%;
}

div#construction > .content > .item > div.hd3 {
margin-top:10px;
font-size:18px;
font-weight:bold;
}


/*---------------------------------------------------*/








/* css transform generator
https://html-css-js.com/css/generator/transform/ 
https://front-end-tools.com/en/generateTransform/
*/


/* Анимация картинки (начальное смещение)*/ 
div#construction > .content > .item > img {
    margin-bottom:10px;
	transform: translate(0px, 0px) scale(0.1)  /*rotate(360deg) rotateY(-90deg) rotateX(-10deg) */;
    /* clip-path: circle(0px at 150px 150px);*/
	opacity: 0;
	transition: all 0.8s ease 0s;
}
/* Анимация картинки (конечная точка)*/
div#construction > .content ._active > img {
	opacity: 1;
	transform: translate(0px, 0px) scale(1.0)  /*rotate(0deg)*/;
	/*clip-path: circle(130px at 150px 150px);*/
}


/* Анимация текста (начальное смещение) */
div#construction > .content > .item > div.txt {
  font-family: Open Sans, sans-serif;
  font-size: calc(12px + 3 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 400;
  color: #455B66;
  line-height: 125%;
  margin-bottom: 10px;
  border:0px solid #aaaaaa;
  
    bottom:10px; 
    left: 0;
    right: 0;
    margin: auto
	transform: translate(0%, 0%);
	opacity: 0;
	transition: all 0.8s ease 0.65s;
}

/* Анимация текста (конечная точка) */
div#construction > .content ._active > div.txt {
	opacity: 1;
	transform: translate(0px, 0px);
}




div#construction > .content > .item > div.txt > p {
  font-family: Open Sans, sans-serif;
  font-size: calc(15px + 3 * ((100vw - 320px) / (1920 - 320)));
  font-weight: 400;
  color: #455B66;
  line-height: 125%;
}





/* Анимация заголовка (начальное смещение) */
div#construction > .content ._anim-show_hdr {
	transform: translate(0px, 0px);
	opacity: 0;
	transition: all 0.8s ease 0.5s;
}
/* Анимация заголовка (конечная точка) */
div#construction > .content ._active ._anim-show_hdr {
	opacity: 1;
	transform: translate(0px, 0px);
}




/*---------------------------------------------------*/
@media all and (min-width: 40em) {
div#construction > .content > .item {
    width: 50%;
  }
}

@media all and (min-width: 60em) {
div#construction > .content > .item {
    width: 33.33%;
  }
}

@media all and (min-width: 80em) {
div#construction > .content > .item {
    width: 25%;
  }
}
