/*
* {
  margin: 0;
  padding: 0;
  font-family: verdana
}

body {
  width: 100%;
  height: 100%
}
*/


#wrapper_bu {
/*  position: absolute;
  top: 150px;*/
  width: 100%;
  height: 100%;
  /*background-color: #ddd;*/
  position:relative;
  min-height:385px;
}

.txt_Center { margin: 50% 0% 0% 20% }

.txt_h1 { font-size: 2em }

.holder_bu { cursor: pointer }

.holder_bu_awayL1 {
  position: absolute;
  top: 30%;
  left: 10%;
  width: 10%;
  height: 40%;
  background-color: rgba(0,0,50,0.7);
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s
}

.holder_bu_awayL2 {
  position: absolute;
  top: 35%;
  left: 0%;
  width: 10%;
  height: 30%;
  background-color: rgba(0,0,50,0.5);
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s
}

.holder_bu_center {
  position: absolute;
  top:0;
  left:0;
  width:75%;
  /*height: 90%;*/
  /*background-color: #37c;*/
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s;
  z-index:4;
}

.holder_bu_awayR1 {
  position: absolute;
  top:0;
  left:10%;
  width:77%;
  /*height:40%;*/
  /*background-color: rgba(0,0,50,0.7);*/
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s;
  z-index:3;
}

.holder_bu_awayR2 {
  position: absolute;
  top:12%;
  left: 40%;
  width: 54%;
  /*height: 30%;*/
  /*background-color: rgba(0,0,50,0.5);*/
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s;
  z-index:2;
}
.holder_bu_awayR3 {
  position: absolute;
  top: 22%;
  left: 68%;
  width: 33%;
  /*height: 30%;*/
  background-color: rgba(0,0,50,0.5);
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s
}
.holder_bu_awayR4 {
  position: absolute;
  top: 45%;
  left: 90%;
  width: 10%;
  height: 30%;
  background-color: rgba(0,0,50,0.5);
  -webkit-transition: width 1s, height 1s, top 1s, left 1s;
  -moz-transition: width 1s, height 1s, top 1s, left 1s;
  -o-transition: width 1s, height 1s, top 1s, left 1s;
  -ms-transition: width 1s, height 1s, top 1s, left 1s;
  transition: width 1s, height 1s, top 1s, left 1s
}

#bu1 img, #bu2 img, #bu3 img, #bu4 img{
  transform: scaleY(0.8);
}
#bu2.holder_bu_center img, #bu3.holder_bu_center img, #bu4.holder_bu_center img, #bu1.holder_bu_center img{
  transform: scaleY(1);
}