Difference between revisions of "Team:Hong Kong HKUST/Team"

Line 666: Line 666:
 
}
 
}
 
//advisor
 
//advisor
 +
.ih-item {
 +
  position: relative;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item,
 +
.ih-item * {
 +
  -webkit-box-sizing: border-box;
 +
  -moz-box-sizing: border-box;
 +
  box-sizing: border-box;
 +
}
 +
.ih-item a {
 +
  color: #333;
 +
}
 +
.ih-item a:hover {
 +
  text-decoration: none;
 +
}
 +
.ih-item img {
 +
  width: 100%;
 +
  height: 100%;
 +
}
 +
 +
.ih-item.circle {
 +
  position: relative;
 +
  width: 220px;
 +
  height: 220px;
 +
  border-radius: 50%;
 +
}
 +
.ih-item.circle .img {
 +
  position: relative;
 +
  width: 220px;
 +
  height: 220px;
 +
  border-radius: 50%;
 +
}
 +
.ih-item.circle .img:before {
 +
  position: absolute;
 +
  display: block;
 +
  content: '';
 +
  width: 100%;
 +
  height: 100%;
 +
  border-radius: 50%;
 +
  box-shadow: inset 0 0 0 16px rgba(255, 255, 255, 0.6), 0 1px 2px rgba(0, 0, 0, 0.3);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle .img img {
 +
  border-radius: 50%;
 +
}
 +
.ih-item.circle .info {
 +
  position: absolute;
 +
  top: 0;
 +
  bottom: 0;
 +
  left: 0;
 +
  right: 0;
 +
  text-align: center;
 +
  border-radius: 50%;
 +
  -webkit-backface-visibility: hidden;
 +
  backface-visibility: hidden;
 +
}
 +
 +
.ih-item.square {
 +
  position: relative;
 +
  width: 316px;
 +
  height: 216px;
 +
  border: 8px solid #fff;
 +
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.square .info {
 +
  position: absolute;
 +
  top: 0;
 +
  bottom: 0;
 +
  left: 0;
 +
  right: 0;
 +
  text-align: center;
 +
  -webkit-backface-visibility: hidden;
 +
  backface-visibility: hidden;
 +
}
 +
 +
.ih-item.circle.effect1 .spinner {
 +
  width: 230px;
 +
  height: 230px;
 +
  border: 10px solid #ecab18;
 +
  border-right-color: #1ad280;
 +
  border-bottom-color: #1ad280;
 +
  border-radius: 50%;
 +
  -webkit-transition: all 0.8s ease-in-out;
 +
  -moz-transition: all 0.8s ease-in-out;
 +
  transition: all 0.8s ease-in-out;
 +
}
 +
.ih-item.circle.effect1 .img {
 +
  position: absolute;
 +
  top: 10px;
 +
  bottom: 0;
 +
  left: 10px;
 +
  right: 0;
 +
  width: auto;
 +
  height: auto;
 +
}
 +
.ih-item.circle.effect1 .img:before {
 +
  display: none;
 +
}
 +
.ih-item.circle.effect1.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.circle.effect1 .info {
 +
  top: 10px;
 +
  bottom: 0;
 +
  left: 10px;
 +
  right: 0;
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  opacity: 0;
 +
  -webkit-transition: all 0.8s ease-in-out;
 +
  -moz-transition: all 0.8s ease-in-out;
 +
  transition: all 0.8s ease-in-out;
 +
}
 +
.ih-item.circle.effect1 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect1 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect1 a:hover .spinner {
 +
  -webkit-transform: rotate(180deg);
 +
  -moz-transform: rotate(180deg);
 +
  -ms-transform: rotate(180deg);
 +
  -o-transform: rotate(180deg);
 +
  transform: rotate(180deg);
 +
}
 +
.ih-item.circle.effect1 a:hover .info {
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.circle.effect2 .img {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect2.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.circle.effect2 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect2 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect2 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
 +
.ih-item.circle.effect2.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect2.left_to_right a:hover .img {
 +
  -webkit-transform: rotate(-90deg);
 +
  -moz-transform: rotate(-90deg);
 +
  -ms-transform: rotate(-90deg);
 +
  -o-transform: rotate(-90deg);
 +
  transform: rotate(-90deg);
 +
}
 +
.ih-item.circle.effect2.left_to_right a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect2.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect2.right_to_left a:hover .img {
 +
  -webkit-transform: rotate(90deg);
 +
  -moz-transform: rotate(90deg);
 +
  -ms-transform: rotate(90deg);
 +
  -o-transform: rotate(90deg);
 +
  transform: rotate(90deg);
 +
}
 +
.ih-item.circle.effect2.right_to_left a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect2.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect2.top_to_bottom a:hover .img {
 +
  -webkit-transform: rotate(-90deg);
 +
  -moz-transform: rotate(-90deg);
 +
  -ms-transform: rotate(-90deg);
 +
  -o-transform: rotate(-90deg);
 +
  transform: rotate(-90deg);
 +
}
 +
.ih-item.circle.effect2.top_to_bottom a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect2.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect2.bottom_to_top a:hover .img {
 +
  -webkit-transform: rotate(90deg);
 +
  -moz-transform: rotate(90deg);
 +
  -ms-transform: rotate(90deg);
 +
  -o-transform: rotate(90deg);
 +
  transform: rotate(90deg);
 +
}
 +
.ih-item.circle.effect2.bottom_to_top a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect3 .img {
 +
  z-index: 11;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect3.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect3 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect3 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect3 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
 +
.ih-item.circle.effect3.left_to_right .img {
 +
  -webkit-transform: scale(1) translateX(0);
 +
  -moz-transform: scale(1) translateX(0);
 +
  -ms-transform: scale(1) translateX(0);
 +
  -o-transform: scale(1) translateX(0);
 +
  transform: scale(1) translateX(0);
 +
}
 +
.ih-item.circle.effect3.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect3.left_to_right a:hover .img {
 +
  -webkit-transform: scale(0.5) translateX(100%);
 +
  -moz-transform: scale(0.5) translateX(100%);
 +
  -ms-transform: scale(0.5) translateX(100%);
 +
  -o-transform: scale(0.5) translateX(100%);
 +
  transform: scale(0.5) translateX(100%);
 +
}
 +
.ih-item.circle.effect3.left_to_right a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect3.right_to_left .img {
 +
  -webkit-transform: scale(1) translateX(0);
 +
  -moz-transform: scale(1) translateX(0);
 +
  -ms-transform: scale(1) translateX(0);
 +
  -o-transform: scale(1) translateX(0);
 +
  transform: scale(1) translateX(0);
 +
}
 +
.ih-item.circle.effect3.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect3.right_to_left a:hover .img {
 +
  -webkit-transform: scale(0.5) translateX(-100%);
 +
  -moz-transform: scale(0.5) translateX(-100%);
 +
  -ms-transform: scale(0.5) translateX(-100%);
 +
  -o-transform: scale(0.5) translateX(-100%);
 +
  transform: scale(0.5) translateX(-100%);
 +
}
 +
.ih-item.circle.effect3.right_to_left a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect3.top_to_bottom .img {
 +
  -webkit-transform: scale(1) translateY(0);
 +
  -moz-transform: scale(1) translateY(0);
 +
  -ms-transform: scale(1) translateY(0);
 +
  -o-transform: scale(1) translateY(0);
 +
  transform: scale(1) translateY(0);
 +
}
 +
.ih-item.circle.effect3.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect3.top_to_bottom a:hover .img {
 +
  -webkit-transform: scale(0.5) translateY(100%);
 +
  -moz-transform: scale(0.5) translateY(100%);
 +
  -ms-transform: scale(0.5) translateY(100%);
 +
  -o-transform: scale(0.5) translateY(100%);
 +
  transform: scale(0.5) translateY(100%);
 +
}
 +
.ih-item.circle.effect3.top_to_bottom a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect3.bottom_to_top .img {
 +
  -webkit-transform: scale(1) translateY(0);
 +
  -moz-transform: scale(1) translateY(0);
 +
  -ms-transform: scale(1) translateY(0);
 +
  -o-transform: scale(1) translateY(0);
 +
  transform: scale(1) translateY(0);
 +
}
 +
.ih-item.circle.effect3.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect3.bottom_to_top a:hover .img {
 +
  -webkit-transform: scale(0.5) translateY(-100%);
 +
  -moz-transform: scale(0.5) translateY(-100%);
 +
  -ms-transform: scale(0.5) translateY(-100%);
 +
  -o-transform: scale(0.5) translateY(-100%);
 +
  transform: scale(0.5) translateY(-100%);
 +
}
 +
.ih-item.circle.effect3.bottom_to_top a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect4 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.4s ease-in-out;
 +
  -moz-transition: all 0.4s ease-in-out;
 +
  transition: all 0.4s ease-in-out;
 +
}
 +
.ih-item.circle.effect4.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect4 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease;
 +
  -moz-transition: all 0.35s ease;
 +
  transition: all 0.35s ease;
 +
}
 +
.ih-item.circle.effect4 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect4 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect4 a:hover .img {
 +
  opacity: 0;
 +
  pointer-events: none;
 +
}
 +
.ih-item.circle.effect4 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.circle.effect4.left_to_right .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.circle.effect4.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect4.left_to_right a:hover .img {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect4.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect4.right_to_left .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.circle.effect4.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect4.right_to_left a:hover .img {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect4.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect4.top_to_bottom .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect4.top_to_bottom .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect4.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect4.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect4.bottom_to_top .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect4.bottom_to_top .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect4.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect4.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect5 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.circle.effect5.colored .info .info-back {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.circle.effect5 .info {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform-style: preserve-3d;
 +
  -moz-transform-style: preserve-3d;
 +
  -ms-transform-style: preserve-3d;
 +
  -o-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
}
 +
.ih-item.circle.effect5 .info .info-back {
 +
  visibility: hidden;
 +
  border-radius: 50%;
 +
  width: 100%;
 +
  height: 100%;
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  -webkit-transform: rotate3d(0, 1, 0, 180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, 180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, 180deg);
 +
  -o-transform: rotate3d(0, 1, 0, 180deg);
 +
  transform: rotate3d(0, 1, 0, 180deg);
 +
  -webkit-backface-visibility: hidden;
 +
  backface-visibility: hidden;
 +
}
 +
.ih-item.circle.effect5 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect5 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect5 a:hover .info {
 +
  -webkit-transform: rotate3d(0, 1, 0, -180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, -180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, -180deg);
 +
  -o-transform: rotate3d(0, 1, 0, -180deg);
 +
  transform: rotate3d(0, 1, 0, -180deg);
 +
}
 +
.ih-item.circle.effect5 a:hover .info .info-back {
 +
  visibility: visible;
 +
}
 +
 +
.ih-item.circle.effect6 .img {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect6.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect6 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect6 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect6 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
 +
.ih-item.circle.effect6.scale_up .info {
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect6.scale_up a:hover .img {
 +
  opacity: 0;
 +
  -webkit-transform: scale(1.5);
 +
  -moz-transform: scale(1.5);
 +
  -ms-transform: scale(1.5);
 +
  -o-transform: scale(1.5);
 +
  transform: scale(1.5);
 +
}
 +
.ih-item.circle.effect6.scale_up a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect6.scale_down .info {
 +
  -webkit-transform: scale(1.5);
 +
  -moz-transform: scale(1.5);
 +
  -ms-transform: scale(1.5);
 +
  -o-transform: scale(1.5);
 +
  transform: scale(1.5);
 +
}
 +
.ih-item.circle.effect6.scale_down a:hover .img {
 +
  opacity: 0;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect6.scale_down a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect6.scale_down_up .info {
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
  -webkit-transition: all 0.35s ease-in-out 0.2s;
 +
  -moz-transition: all 0.35s ease-in-out 0.2s;
 +
  transition: all 0.35s ease-in-out 0.2s;
 +
}
 +
.ih-item.circle.effect6.scale_down_up a:hover .img {
 +
  opacity: 0;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect6.scale_down_up a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect7 .img {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.35s ease-out;
 +
  -moz-transition: all 0.35s ease-out;
 +
  transition: all 0.35s ease-out;
 +
}
 +
.ih-item.circle.effect7.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect7 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease 0.2s;
 +
  -moz-transition: all 0.35s ease 0.2s;
 +
  transition: all 0.35s ease 0.2s;
 +
}
 +
.ih-item.circle.effect7 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect7 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect7 a:hover .img {
 +
  opacity: 0;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect7 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.circle.effect7.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect7.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect7.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect7.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect7.top_to_bottom .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect7.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect7.bottom_to_top .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect7.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect8.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect8 .img-container {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.3s ease-in-out;
 +
  -moz-transition: all 0.3s ease-in-out;
 +
  transition: all 0.3s ease-in-out;
 +
}
 +
.ih-item.circle.effect8 .img-container .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.3s ease-in-out 0.3s;
 +
  -moz-transition: all 0.3s ease-in-out 0.3s;
 +
  transition: all 0.3s ease-in-out 0.3s;
 +
}
 +
.ih-item.circle.effect8 .info-container {
 +
  position: absolute;
 +
  top: 0;
 +
  bottom: 0;
 +
  left: 0;
 +
  right: 0;
 +
  text-align: center;
 +
  border-radius: 50%;
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.3s ease-in-out 0.3s;
 +
  -moz-transition: all 0.3s ease-in-out 0.3s;
 +
  transition: all 0.3s ease-in-out 0.3s;
 +
}
 +
.ih-item.circle.effect8 .info {
 +
  width: 100%;
 +
  height: 100%;
 +
  background: #333333;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
  -webkit-transition: all 0.35s ease-in-out 0.6s;
 +
  -moz-transition: all 0.35s ease-in-out 0.6s;
 +
  transition: all 0.35s ease-in-out 0.6s;
 +
}
 +
.ih-item.circle.effect8 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 45px 0 0 0;
 +
  height: 140px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect8 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect8 a:hover .img-container {
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect8 a:hover .img-container .img {
 +
  opacity: 0;
 +
  pointer-events: none;
 +
}
 +
.ih-item.circle.effect8 a:hover .info-container {
 +
  opacity: 1;
 +
}
 +
.ih-item.circle.effect8 a:hover .info-container .info {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect8.left_to_right .img-container .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.circle.effect8.left_to_right .info-container {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect8.left_to_right a:hover .img-container .img {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect8.left_to_right a:hover .info-container {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect8.right_to_left .img-container .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.circle.effect8.right_to_left .info-container {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect8.right_to_left a:hover .img-container .img {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect8.right_to_left a:hover .info-container {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect8.top_to_bottom .img-container .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect8.top_to_bottom .info-container {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect8.top_to_bottom a:hover .img-container .img {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect8.top_to_bottom a:hover .info-container {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect8.bottom_to_top .img-container .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect8.bottom_to_top .info-container {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect8.bottom_to_top a:hover .img-container .img {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect8.bottom_to_top a:hover .info-container {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect9 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.35s ease-out;
 +
  -moz-transition: all 0.35s ease-out;
 +
  transition: all 0.35s ease-out;
 +
}
 +
.ih-item.circle.effect9.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect9 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
  -webkit-transition: all 0.35s ease 0.2s;
 +
  -moz-transition: all 0.35s ease 0.2s;
 +
  transition: all 0.35s ease 0.2s;
 +
}
 +
.ih-item.circle.effect9 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect9 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect9 a:hover .img {
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.circle.effect9 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect9.left_to_right .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.circle.effect9.left_to_right a:hover .img {
 +
  -webkit-transform: translateX(100%) rotate(180deg);
 +
  -moz-transform: translateX(100%) rotate(180deg);
 +
  -ms-transform: translateX(100%) rotate(180deg);
 +
  -o-transform: translateX(100%) rotate(180deg);
 +
  transform: translateX(100%) rotate(180deg);
 +
}
 +
 +
.ih-item.circle.effect9.right_to_left .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.circle.effect9.right_to_left a:hover .img {
 +
  -webkit-transform: translateX(-100%) rotate(-180deg);
 +
  -moz-transform: translateX(-100%) rotate(-180deg);
 +
  -ms-transform: translateX(-100%) rotate(-180deg);
 +
  -o-transform: translateX(-100%) rotate(-180deg);
 +
  transform: translateX(-100%) rotate(-180deg);
 +
}
 +
 +
.ih-item.circle.effect9.top_to_bottom .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect9.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
 +
.ih-item.circle.effect9.bottom_to_top .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect9.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
 +
.ih-item.circle.effect10 .img {
 +
  z-index: 11;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect10.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect10 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect10 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect10 .info p {
 +
  color: #bbb;
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect10 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect10.top_to_bottom .info h3 {
 +
  margin: 0 30px;
 +
  padding: 25px 0 0 0;
 +
  height: 78px;
 +
}
 +
.ih-item.circle.effect10.top_to_bottom .info p {
 +
  margin: 0 30px;
 +
  padding: 5px;
 +
}
 +
.ih-item.circle.effect10.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(50px) scale(0.5);
 +
  -moz-transform: translateY(50px) scale(0.5);
 +
  -ms-transform: translateY(50px) scale(0.5);
 +
  -o-transform: translateY(50px) scale(0.5);
 +
  transform: translateY(50px) scale(0.5);
 +
}
 +
 +
.ih-item.circle.effect10.bottom_to_top .info h3 {
 +
  margin: 95px 30px 0;
 +
  padding: 25px 0 0 0;
 +
  height: 78px;
 +
}
 +
.ih-item.circle.effect10.bottom_to_top .info p {
 +
  margin: 0 30px;
 +
  padding: 5px;
 +
}
 +
.ih-item.circle.effect10.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(-50px) scale(0.5);
 +
  -moz-transform: translateY(-50px) scale(0.5);
 +
  -ms-transform: translateY(-50px) scale(0.5);
 +
  -o-transform: translateY(-50px) scale(0.5);
 +
  transform: translateY(-50px) scale(0.5);
 +
}
 +
 +
.ih-item.circle.effect11 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.circle.effect11 .img {
 +
  opacity: 1;
 +
  -webkit-transform-origin: 50% 50%;
 +
  -moz-transform-origin: 50% 50%;
 +
  -ms-transform-origin: 50% 50%;
 +
  -o-transform-origin: 50% 50%;
 +
  transform-origin: 50% 50%;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect11.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect11 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  -webkit-transition: all 0.35s ease 0.35s;
 +
  -moz-transition: all 0.35s ease 0.35s;
 +
  transition: all 0.35s ease 0.35s;
 +
}
 +
.ih-item.circle.effect11 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect11 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect11 a:hover .img {
 +
  opacity: 0;
 +
}
 +
.ih-item.circle.effect11 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.circle.effect11.left_to_right .img {
 +
  -webkit-transform: translateZ(0) rotateY(0);
 +
  -moz-transform: translateZ(0) rotateY(0);
 +
  -ms-transform: translateZ(0) rotateY(0);
 +
  -o-transform: translateZ(0) rotateY(0);
 +
  transform: translateZ(0) rotateY(0);
 +
}
 +
.ih-item.circle.effect11.left_to_right .info {
 +
  -webkit-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -moz-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -ms-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -o-transform: translateZ(-1000px) rotateY(-90deg);
 +
  transform: translateZ(-1000px) rotateY(-90deg);
 +
}
 +
.ih-item.circle.effect11.left_to_right a:hover .img {
 +
  -webkit-transform: translateZ(-1000px) rotateY(90deg);
 +
  -moz-transform: translateZ(-1000px) rotateY(90deg);
 +
  -ms-transform: translateZ(-1000px) rotateY(90deg);
 +
  -o-transform: translateZ(-1000px) rotateY(90deg);
 +
  transform: translateZ(-1000px) rotateY(90deg);
 +
}
 +
.ih-item.circle.effect11.left_to_right a:hover .info {
 +
  -webkit-transform: translateZ(0) rotateY(0);
 +
  -moz-transform: translateZ(0) rotateY(0);
 +
  -ms-transform: translateZ(0) rotateY(0);
 +
  -o-transform: translateZ(0) rotateY(0);
 +
  transform: translateZ(0) rotateY(0);
 +
}
 +
 +
.ih-item.circle.effect11.right_to_left .img {
 +
  -webkit-transform: translateZ(0) rotateY(0);
 +
  -moz-transform: translateZ(0) rotateY(0);
 +
  -ms-transform: translateZ(0) rotateY(0);
 +
  -o-transform: translateZ(0) rotateY(0);
 +
  transform: translateZ(0) rotateY(0);
 +
}
 +
.ih-item.circle.effect11.right_to_left .info {
 +
  -webkit-transform: translateZ(-1000px) rotateY(90deg);
 +
  -moz-transform: translateZ(-1000px) rotateY(90deg);
 +
  -ms-transform: translateZ(-1000px) rotateY(90deg);
 +
  -o-transform: translateZ(-1000px) rotateY(90deg);
 +
  transform: translateZ(-1000px) rotateY(90deg);
 +
}
 +
.ih-item.circle.effect11.right_to_left a:hover .img {
 +
  -webkit-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -moz-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -ms-transform: translateZ(-1000px) rotateY(-90deg);
 +
  -o-transform: translateZ(-1000px) rotateY(-90deg);
 +
  transform: translateZ(-1000px) rotateY(-90deg);
 +
}
 +
.ih-item.circle.effect11.right_to_left a:hover .info {
 +
  -webkit-transform: translateZ(0) rotateY(0);
 +
  -moz-transform: translateZ(0) rotateY(0);
 +
  -ms-transform: translateZ(0) rotateY(0);
 +
  -o-transform: translateZ(0) rotateY(0);
 +
  transform: translateZ(0) rotateY(0);
 +
}
 +
 +
.ih-item.circle.effect11.top_to_bottom .img {
 +
  -webkit-transform: translateZ(0) rotateX(0);
 +
  -moz-transform: translateZ(0) rotateX(0);
 +
  -ms-transform: translateZ(0) rotateX(0);
 +
  -o-transform: translateZ(0) rotateX(0);
 +
  transform: translateZ(0) rotateX(0);
 +
}
 +
.ih-item.circle.effect11.top_to_bottom .info {
 +
  -webkit-transform: translateZ(-1000px) rotateX(90deg);
 +
  -moz-transform: translateZ(-1000px) rotateX(90deg);
 +
  -ms-transform: translateZ(-1000px) rotateX(90deg);
 +
  -o-transform: translateZ(-1000px) rotateX(90deg);
 +
  transform: translateZ(-1000px) rotateX(90deg);
 +
}
 +
.ih-item.circle.effect11.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -moz-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -ms-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -o-transform: translateZ(-1000px) rotateX(-90deg);
 +
  transform: translateZ(-1000px) rotateX(-90deg);
 +
}
 +
.ih-item.circle.effect11.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateZ(0) rotateX(0);
 +
  -moz-transform: translateZ(0) rotateX(0);
 +
  -ms-transform: translateZ(0) rotateX(0);
 +
  -o-transform: translateZ(0) rotateX(0);
 +
  transform: translateZ(0) rotateX(0);
 +
}
 +
 +
.ih-item.circle.effect11.bottom_to_top .img {
 +
  -webkit-transform: translateZ(0) rotateX(0);
 +
  -moz-transform: translateZ(0) rotateX(0);
 +
  -ms-transform: translateZ(0) rotateX(0);
 +
  -o-transform: translateZ(0) rotateX(0);
 +
  transform: translateZ(0) rotateX(0);
 +
}
 +
.ih-item.circle.effect11.bottom_to_top .info {
 +
  -webkit-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -moz-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -ms-transform: translateZ(-1000px) rotateX(-90deg);
 +
  -o-transform: translateZ(-1000px) rotateX(-90deg);
 +
  transform: translateZ(-1000px) rotateX(-90deg);
 +
}
 +
.ih-item.circle.effect11.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateZ(-1000px) rotateX(90deg);
 +
  -moz-transform: translateZ(-1000px) rotateX(90deg);
 +
  -ms-transform: translateZ(-1000px) rotateX(90deg);
 +
  -o-transform: translateZ(-1000px) rotateX(90deg);
 +
  transform: translateZ(-1000px) rotateX(90deg);
 +
}
 +
.ih-item.circle.effect11.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateZ(0) rotateX(0);
 +
  -moz-transform: translateZ(0) rotateX(0);
 +
  -ms-transform: translateZ(0) rotateX(0);
 +
  -o-transform: translateZ(0) rotateX(0);
 +
  transform: translateZ(0) rotateX(0);
 +
}
 +
 +
.ih-item.circle.effect12 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect12.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect12 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect12 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect12 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect12 a:hover .img {
 +
  opacity: 0;
 +
  pointer-events: none;
 +
}
 +
.ih-item.circle.effect12 a:hover .info {
 +
  opacity: 1;
 +
  visibility: visible;
 +
}
 +
 +
.ih-item.circle.effect12.left_to_right .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.circle.effect12.left_to_right .info {
 +
  -webkit-transform: translateX(100%) rotate(180deg);
 +
  -moz-transform: translateX(100%) rotate(180deg);
 +
  -ms-transform: translateX(100%) rotate(180deg);
 +
  -o-transform: translateX(100%) rotate(180deg);
 +
  transform: translateX(100%) rotate(180deg);
 +
}
 +
.ih-item.circle.effect12.left_to_right a:hover .img {
 +
  -webkit-transform: translateX(100%) rotate(180deg);
 +
  -moz-transform: translateX(100%) rotate(180deg);
 +
  -ms-transform: translateX(100%) rotate(180deg);
 +
  -o-transform: translateX(100%) rotate(180deg);
 +
  transform: translateX(100%) rotate(180deg);
 +
}
 +
.ih-item.circle.effect12.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.circle.effect12.right_to_left .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.circle.effect12.right_to_left .info {
 +
  -webkit-transform: translateX(-100%) rotate(-180deg);
 +
  -moz-transform: translateX(-100%) rotate(-180deg);
 +
  -ms-transform: translateX(-100%) rotate(-180deg);
 +
  -o-transform: translateX(-100%) rotate(-180deg);
 +
  transform: translateX(-100%) rotate(-180deg);
 +
}
 +
.ih-item.circle.effect12.right_to_left a:hover .img {
 +
  -webkit-transform: translateX(-100%) rotate(-180deg);
 +
  -moz-transform: translateX(-100%) rotate(-180deg);
 +
  -ms-transform: translateX(-100%) rotate(-180deg);
 +
  -o-transform: translateX(-100%) rotate(-180deg);
 +
  transform: translateX(-100%) rotate(-180deg);
 +
}
 +
.ih-item.circle.effect12.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.circle.effect12.top_to_bottom .img {
 +
  -webkit-transform: translateY(0) rotate(0);
 +
  -moz-transform: translateY(0) rotate(0);
 +
  -ms-transform: translateY(0) rotate(0);
 +
  -o-transform: translateY(0) rotate(0);
 +
  transform: translateY(0) rotate(0);
 +
}
 +
.ih-item.circle.effect12.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%) rotate(-180deg);
 +
  -moz-transform: translateY(-100%) rotate(-180deg);
 +
  -ms-transform: translateY(-100%) rotate(-180deg);
 +
  -o-transform: translateY(-100%) rotate(-180deg);
 +
  transform: translateY(-100%) rotate(-180deg);
 +
}
 +
.ih-item.circle.effect12.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(-100%) rotate(-180deg);
 +
  -moz-transform: translateY(-100%) rotate(-180deg);
 +
  -ms-transform: translateY(-100%) rotate(-180deg);
 +
  -o-transform: translateY(-100%) rotate(-180deg);
 +
  transform: translateY(-100%) rotate(-180deg);
 +
}
 +
.ih-item.circle.effect12.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0) rotate(0);
 +
  -moz-transform: translateY(0) rotate(0);
 +
  -ms-transform: translateY(0) rotate(0);
 +
  -o-transform: translateY(0) rotate(0);
 +
  transform: translateY(0) rotate(0);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.circle.effect12.bottom_to_top .img {
 +
  -webkit-transform: translateY(0) rotate(0);
 +
  -moz-transform: translateY(0) rotate(0);
 +
  -ms-transform: translateY(0) rotate(0);
 +
  -o-transform: translateY(0) rotate(0);
 +
  transform: translateY(0) rotate(0);
 +
}
 +
.ih-item.circle.effect12.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%) rotate(180deg);
 +
  -moz-transform: translateY(100%) rotate(180deg);
 +
  -ms-transform: translateY(100%) rotate(180deg);
 +
  -o-transform: translateY(100%) rotate(180deg);
 +
  transform: translateY(100%) rotate(180deg);
 +
}
 +
.ih-item.circle.effect12.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(100%) rotate(180deg);
 +
  -moz-transform: translateY(100%) rotate(180deg);
 +
  -ms-transform: translateY(100%) rotate(180deg);
 +
  -o-transform: translateY(100%) rotate(180deg);
 +
  transform: translateY(100%) rotate(180deg);
 +
}
 +
.ih-item.circle.effect12.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0) rotate(0);
 +
  -moz-transform: translateY(0) rotate(0);
 +
  -ms-transform: translateY(0) rotate(0);
 +
  -o-transform: translateY(0) rotate(0);
 +
  transform: translateY(0) rotate(0);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.circle.effect13.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.circle.effect13 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect13 .info h3 {
 +
  visibility: hidden;
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect13 .info p {
 +
  visibility: hidden;
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect13 a:hover .info {
 +
  opacity: 1;
 +
}
 +
.ih-item.circle.effect13 a:hover h3 {
 +
  visibility: visible;
 +
}
 +
.ih-item.circle.effect13 a:hover p {
 +
  visibility: visible;
 +
}
 +
 +
.ih-item.circle.effect13.from_left_and_right .info h3 {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.circle.effect13.from_left_and_right .info p {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.circle.effect13.from_left_and_right a:hover h3 {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.circle.effect13.from_left_and_right a:hover p {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.circle.effect13.top_to_bottom .info h3 {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect13.top_to_bottom .info p {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.circle.effect13.top_to_bottom a:hover h3 {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect13.top_to_bottom a:hover p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect13.bottom_to_top .info h3 {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect13.bottom_to_top .info p {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.circle.effect13.bottom_to_top a:hover h3 {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.circle.effect13.bottom_to_top a:hover p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.circle.effect14 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.circle.effect14 .img {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transition: all 0.4s ease-out;
 +
  -moz-transition: all 0.4s ease-out;
 +
  transition: all 0.4s ease-out;
 +
}
 +
.ih-item.circle.effect14.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect14 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  -webkit-transition: all 0.35s ease-in-out 0.3s;
 +
  -moz-transition: all 0.35s ease-in-out 0.3s;
 +
  transition: all 0.35s ease-in-out 0.3s;
 +
}
 +
.ih-item.circle.effect14 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect14 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect14 a:hover .img {
 +
  opacity: 0;
 +
  visibility: hidden;
 +
}
 +
.ih-item.circle.effect14 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.circle.effect14.left_to_right .img {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.circle.effect14.left_to_right .info {
 +
  -webkit-transform: rotateY(90deg);
 +
  -moz-transform: rotateY(90deg);
 +
  -ms-transform: rotateY(90deg);
 +
  -o-transform: rotateY(90deg);
 +
  transform: rotateY(90deg);
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.circle.effect14.left_to_right a:hover .img {
 +
  -webkit-transform: rotateY(-90deg);
 +
  -moz-transform: rotateY(-90deg);
 +
  -ms-transform: rotateY(-90deg);
 +
  -o-transform: rotateY(-90deg);
 +
  transform: rotateY(-90deg);
 +
}
 +
.ih-item.circle.effect14.left_to_right a:hover .info {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
}
 +
 +
.ih-item.circle.effect14.right_to_left .img {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.circle.effect14.right_to_left .info {
 +
  -webkit-transform: rotateY(-90deg);
 +
  -moz-transform: rotateY(-90deg);
 +
  -ms-transform: rotateY(-90deg);
 +
  -o-transform: rotateY(-90deg);
 +
  transform: rotateY(-90deg);
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.circle.effect14.right_to_left a:hover .img {
 +
  -webkit-transform: rotateY(90deg);
 +
  -moz-transform: rotateY(90deg);
 +
  -ms-transform: rotateY(90deg);
 +
  -o-transform: rotateY(90deg);
 +
  transform: rotateY(90deg);
 +
}
 +
.ih-item.circle.effect14.right_to_left a:hover .info {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
}
 +
 +
.ih-item.circle.effect14.top_to_bottom .img {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.circle.effect14.top_to_bottom .info {
 +
  -webkit-transform: rotateX(-90deg);
 +
  -moz-transform: rotateX(-90deg);
 +
  -ms-transform: rotateX(-90deg);
 +
  -o-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.circle.effect14.top_to_bottom a:hover .img {
 +
  -webkit-transform: rotateX(90deg);
 +
  -moz-transform: rotateX(90deg);
 +
  -ms-transform: rotateX(90deg);
 +
  -o-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
}
 +
.ih-item.circle.effect14.top_to_bottom a:hover .info {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
}
 +
 +
.ih-item.circle.effect14.bottom_to_top .img {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.circle.effect14.bottom_to_top .info {
 +
  -webkit-transform: rotateX(90deg);
 +
  -moz-transform: rotateX(90deg);
 +
  -ms-transform: rotateX(90deg);
 +
  -o-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.circle.effect14.bottom_to_top a:hover .img {
 +
  -webkit-transform: rotateX(-90deg);
 +
  -moz-transform: rotateX(-90deg);
 +
  -ms-transform: rotateX(-90deg);
 +
  -o-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
}
 +
.ih-item.circle.effect14.bottom_to_top a:hover .info {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
}
 +
 +
.ih-item.circle.effect15 .img {
 +
  opacity: 1;
 +
  visibility: visible;
 +
  -webkit-transform: scale(1) rotate(0);
 +
  -moz-transform: scale(1) rotate(0);
 +
  -ms-transform: scale(1) rotate(0);
 +
  -o-transform: scale(1) rotate(0);
 +
  transform: scale(1) rotate(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect15.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect15 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  -webkit-transform: scale(0.5) rotate(-720deg);
 +
  -moz-transform: scale(0.5) rotate(-720deg);
 +
  -ms-transform: scale(0.5) rotate(-720deg);
 +
  -o-transform: scale(0.5) rotate(-720deg);
 +
  transform: scale(0.5) rotate(-720deg);
 +
  -webkit-transition: all 0.35s ease-in-out 0.3s;
 +
  -moz-transition: all 0.35s ease-in-out 0.3s;
 +
  transition: all 0.35s ease-in-out 0.3s;
 +
}
 +
.ih-item.circle.effect15 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect15 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect15 a:hover .img {
 +
  opacity: 0;
 +
  visibility: hidden;
 +
  -webkit-transform: scale(0.5) rotate(720deg);
 +
  -moz-transform: scale(0.5) rotate(720deg);
 +
  -ms-transform: scale(0.5) rotate(720deg);
 +
  -o-transform: scale(0.5) rotate(720deg);
 +
  transform: scale(0.5) rotate(720deg);
 +
}
 +
.ih-item.circle.effect15 a:hover .info {
 +
  opacity: 1;
 +
  visibility: visible;
 +
  -webkit-transform: scale(1) rotate(0);
 +
  -moz-transform: scale(1) rotate(0);
 +
  -ms-transform: scale(1) rotate(0);
 +
  -o-transform: scale(1) rotate(0);
 +
  transform: scale(1) rotate(0);
 +
}
 +
 +
.ih-item.circle.effect16 .img {
 +
  z-index: 11;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect16.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect16 .info {
 +
  background: #333333;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect16 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect16 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
 +
.ih-item.circle.effect16.left_to_right .img {
 +
  -webkit-transform-origin: 95% 40%;
 +
  -moz-transform-origin: 95% 40%;
 +
  -ms-transform-origin: 95% 40%;
 +
  -o-transform-origin: 95% 40%;
 +
  transform-origin: 95% 40%;
 +
}
 +
.ih-item.circle.effect16.left_to_right .img:after {
 +
  content: '';
 +
  width: 8px;
 +
  height: 8px;
 +
  position: absolute;
 +
  border-radius: 50%;
 +
  top: 40%;
 +
  left: 95%;
 +
  margin: -4px 0 0 -4px;
 +
  background: rgba(0, 0, 0, 0.8);
 +
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
 +
}
 +
.ih-item.circle.effect16.left_to_right a:hover .img {
 +
  -webkit-transform: rotate(-120deg);
 +
  -moz-transform: rotate(-120deg);
 +
  -ms-transform: rotate(-120deg);
 +
  -o-transform: rotate(-120deg);
 +
  transform: rotate(-120deg);
 +
}
 +
 +
.ih-item.circle.effect16.right_to_left .img {
 +
  -webkit-transform-origin: 5% 40%;
 +
  -moz-transform-origin: 5% 40%;
 +
  -ms-transform-origin: 5% 40%;
 +
  -o-transform-origin: 5% 40%;
 +
  transform-origin: 5% 40%;
 +
}
 +
.ih-item.circle.effect16.right_to_left .img:after {
 +
  content: '';
 +
  width: 8px;
 +
  height: 8px;
 +
  position: absolute;
 +
  border-radius: 50%;
 +
  top: 40%;
 +
  left: 5%;
 +
  margin: -4px 0 0 -4px;
 +
  background: rgba(0, 0, 0, 0.8);
 +
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
 +
}
 +
.ih-item.circle.effect16.right_to_left a:hover .img {
 +
  -webkit-transform: rotate(120deg);
 +
  -moz-transform: rotate(120deg);
 +
  -ms-transform: rotate(120deg);
 +
  -o-transform: rotate(120deg);
 +
  transform: rotate(120deg);
 +
}
 +
 +
.ih-item.circle.effect17 .info {
 +
  opacity: 0;
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect17 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect17 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect17 a:hover .img:before {
 +
  box-shadow: inset 0 0 0 110px #333333, inset 0 0 0 16px rgba(255, 255, 255, 0.8), 0 1px 2px rgba(0, 0, 0, 0.1);
 +
  box-shadow: inset 0 0 0 110px rgba(0, 0, 0, 0.6), inset 0 0 0 16px rgba(255, 255, 255, 0.8), 0 1px 2px rgba(0, 0, 0, 0.1);
 +
}
 +
.ih-item.circle.effect17 a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.circle.effect17 a:hover .info p {
 +
  opacity: 1;
 +
}
 +
.ih-item.circle.effect17.colored a:hover .img:before {
 +
  box-shadow: inset 0 0 0 110px #1a4a72, inset 0 0 0 16px rgba(255, 255, 255, 0.8), 0 1px 2px rgba(0, 0, 0, 0.1);
 +
  box-shadow: inset 0 0 0 110px rgba(26, 74, 114, 0.6), inset 0 0 0 16px rgba(255, 255, 255, 0.8), 0 1px 2px rgba(0, 0, 0, 0.1);
 +
}
 +
 +
.ih-item.circle.effect18 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.circle.effect18 .img {
 +
  z-index: 11;
 +
  -webkit-transition: all 0.5s ease-in-out;
 +
  -moz-transition: all 0.5s ease-in-out;
 +
  transition: all 0.5s ease-in-out;
 +
}
 +
.ih-item.circle.effect18.colored .info .info-back {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect18 .info {
 +
  -webkit-transform-style: preserve-3d;
 +
  -moz-transform-style: preserve-3d;
 +
  -ms-transform-style: preserve-3d;
 +
  -o-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
}
 +
.ih-item.circle.effect18 .info .info-back {
 +
  opacity: 1;
 +
  border-radius: 50%;
 +
  width: 100%;
 +
  height: 100%;
 +
  background: #333333;
 +
}
 +
.ih-item.circle.effect18 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect18 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
 +
.ih-item.circle.effect18.bottom_to_top .img {
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.circle.effect18.bottom_to_top a:hover .img {
 +
  -webkit-transform: rotate3d(1, 0, 0, 180deg);
 +
  -moz-transform: rotate3d(1, 0, 0, 180deg);
 +
  -ms-transform: rotate3d(1, 0, 0, 180deg);
 +
  -o-transform: rotate3d(1, 0, 0, 180deg);
 +
  transform: rotate3d(1, 0, 0, 180deg);
 +
}
 +
 +
.ih-item.circle.effect18.top_to_bottom .img {
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.circle.effect18.top_to_bottom a:hover .img {
 +
  -webkit-transform: rotate3d(1, 0, 0, -180deg);
 +
  -moz-transform: rotate3d(1, 0, 0, -180deg);
 +
  -ms-transform: rotate3d(1, 0, 0, -180deg);
 +
  -o-transform: rotate3d(1, 0, 0, -180deg);
 +
  transform: rotate3d(1, 0, 0, -180deg);
 +
}
 +
 +
.ih-item.circle.effect18.left_to_right .img {
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.circle.effect18.left_to_right a:hover .img {
 +
  -webkit-transform: rotate3d(0, 1, 0, 180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, 180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, 180deg);
 +
  -o-transform: rotate3d(0, 1, 0, 180deg);
 +
  transform: rotate3d(0, 1, 0, 180deg);
 +
}
 +
 +
.ih-item.circle.effect18.right_to_left .img {
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.circle.effect18.right_to_left a:hover .img {
 +
  -webkit-transform: rotate3d(0, 1, 0, -180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, -180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, -180deg);
 +
  -o-transform: rotate3d(0, 1, 0, -180deg);
 +
  transform: rotate3d(0, 1, 0, -180deg);
 +
}
 +
 +
.ih-item.circle.effect19.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.circle.effect19 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  opacity: 0;
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.circle.effect19 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 45px 0 0 0;
 +
  height: 140px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect19 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect19 a:hover .info {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.circle.effect20 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.circle.effect20 .img {
 +
  -webkit-transition: all 0.35s linear;
 +
  -moz-transition: all 0.35s linear;
 +
  transition: all 0.35s linear;
 +
  -webkit-transform-origin: 50% 0%;
 +
  -moz-transform-origin: 50% 0%;
 +
  -ms-transform-origin: 50% 0%;
 +
  -o-transform-origin: 50% 0%;
 +
  transform-origin: 50% 0%;
 +
}
 +
.ih-item.circle.effect20.colored .info .info-back {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.circle.effect20 .info {
 +
  -webkit-transform-style: preserve-3d;
 +
  -moz-transform-style: preserve-3d;
 +
  -ms-transform-style: preserve-3d;
 +
  -o-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
}
 +
.ih-item.circle.effect20 .info .info-back {
 +
  opacity: 1;
 +
  visibility: hidden;
 +
  border-radius: 50%;
 +
  width: 100%;
 +
  height: 100%;
 +
  background: #333333;
 +
  -webkit-transition: all 0.35s linear;
 +
  -moz-transition: all 0.35s linear;
 +
  transition: all 0.35s linear;
 +
  -webkit-transform-origin: 50% 0%;
 +
  -moz-transform-origin: 50% 0%;
 +
  -ms-transform-origin: 50% 0%;
 +
  -o-transform-origin: 50% 0%;
 +
  transform-origin: 50% 0%;
 +
  -webkit-backface-visibility: hidden;
 +
  backface-visibility: hidden;
 +
}
 +
.ih-item.circle.effect20 .info h3 {
 +
  color: #fff;
 +
  text-transform: uppercase;
 +
  position: relative;
 +
  letter-spacing: 2px;
 +
  font-size: 22px;
 +
  margin: 0 30px;
 +
  padding: 55px 0 0 0;
 +
  height: 110px;
 +
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
 +
}
 +
.ih-item.circle.effect20 .info p {
 +
  color: #bbb;
 +
  padding: 10px 5px;
 +
  font-style: italic;
 +
  margin: 0 30px;
 +
  font-size: 12px;
 +
  border-top: 1px solid rgba(255, 255, 255, 0.5);
 +
}
 +
.ih-item.circle.effect20 a:hover .img {
 +
  opacity: 0;
 +
}
 +
.ih-item.circle.effect20 a:hover .info .info-back {
 +
  opacity: 1;
 +
  visibility: visible;
 +
}
 +
 +
.ih-item.circle.effect20.top_to_bottom .info .info-back {
 +
  -webkit-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -moz-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -ms-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -o-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
}
 +
.ih-item.circle.effect20.top_to_bottom a:hover .img {
 +
  -webkit-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -moz-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -ms-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -o-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
}
 +
.ih-item.circle.effect20.top_to_bottom a:hover .info .info-back {
 +
  -webkit-transform: rotate3d(1, 0, 0, 0deg);
 +
  -moz-transform: rotate3d(1, 0, 0, 0deg);
 +
  -ms-transform: rotate3d(1, 0, 0, 0deg);
 +
  -o-transform: rotate3d(1, 0, 0, 0deg);
 +
  transform: rotate3d(1, 0, 0, 0deg);
 +
}
 +
 +
.ih-item.circle.effect20.bottom_to_top .info .info-back {
 +
  -webkit-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -moz-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -ms-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  -o-transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
  transform: translate3d(0, 280px, 0) rotate3d(1, 0, 0, -90deg);
 +
}
 +
.ih-item.circle.effect20.bottom_to_top a:hover .img {
 +
  -webkit-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -moz-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -ms-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  -o-transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
  transform: translate3d(0, 0, -220px) rotate3d(1, 0, 0, 90deg);
 +
}
 +
.ih-item.circle.effect20.bottom_to_top a:hover .info .info-back {
 +
  -webkit-transform: rotate3d(1, 0, 0, 0deg);
 +
  -moz-transform: rotate3d(1, 0, 0, 0deg);
 +
  -ms-transform: rotate3d(1, 0, 0, 0deg);
 +
  -o-transform: rotate3d(1, 0, 0, 0deg);
 +
  transform: rotate3d(1, 0, 0, 0deg);
 +
}
 +
 +
.ih-item.square.effect1 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect1.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect1 .img {
 +
  z-index: 11;
 +
  position: absolute;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect1 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect1 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.square.effect1.left_and_right .info h3 {
 +
  position: absolute;
 +
  top: 12px;
 +
  left: 12px;
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  margin: 0;
 +
}
 +
.ih-item.square.effect1.left_and_right .info p {
 +
  position: absolute;
 +
  right: 12px;
 +
  bottom: 12px;
 +
  margin: 0;
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  color: #bbb;
 +
}
 +
.ih-item.square.effect1.left_and_right a:hover .img {
 +
  -webkit-transform: scale(0.6);
 +
  -moz-transform: scale(0.6);
 +
  -ms-transform: scale(0.6);
 +
  -o-transform: scale(0.6);
 +
  transform: scale(0.6);
 +
}
 +
 +
.ih-item.square.effect1.top_to_bottom .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px 10px 0 4px;
 +
  margin: 10px 0 0 0;
 +
}
 +
.ih-item.square.effect1.top_to_bottom .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  color: #bbb;
 +
  padding: 5px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect1.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(30px) scale(0.6);
 +
  -moz-transform: translateY(30px) scale(0.6);
 +
  -ms-transform: translateY(30px) scale(0.6);
 +
  -o-transform: translateY(30px) scale(0.6);
 +
  transform: translateY(30px) scale(0.6);
 +
}
 +
 +
.ih-item.square.effect1.bottom_to_top .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px 10px 0 4px;
 +
  margin: 134px 0 0 0;
 +
}
 +
.ih-item.square.effect1.bottom_to_top .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  color: #bbb;
 +
  padding: 5px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect1.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(-30px) scale(0.6);
 +
  -moz-transform: translateY(-30px) scale(0.6);
 +
  -ms-transform: translateY(-30px) scale(0.6);
 +
  -o-transform: translateY(-30px) scale(0.6);
 +
  transform: translateY(-30px) scale(0.6);
 +
}
 +
 +
.ih-item.square.effect2 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect2.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect2.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect2 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.5s ease-in-out;
 +
  -moz-transition: all 0.5s ease-in-out;
 +
  transition: all 0.5s ease-in-out;
 +
  -webkit-transform: rotate(0deg) scale(1);
 +
  -moz-transform: rotate(0deg) scale(1);
 +
  -ms-transform: rotate(0deg) scale(1);
 +
  -o-transform: rotate(0deg) scale(1);
 +
  transform: rotate(0deg) scale(1);
 +
}
 +
.ih-item.square.effect2 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  -webkit-transition: all 0.35s 0.3s ease-in-out;
 +
  -moz-transition: all 0.35s 0.3s ease-in-out;
 +
  transition: all 0.35s 0.3s ease-in-out;
 +
}
 +
.ih-item.square.effect2 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
  -webkit-transform: translateY(-200px);
 +
  -moz-transform: translateY(-200px);
 +
  -ms-transform: translateY(-200px);
 +
  -o-transform: translateY(-200px);
 +
  transform: translateY(-200px);
 +
  -webkit-transition: all 0.35s 0.6s ease-in-out;
 +
  -moz-transition: all 0.35s 0.6s ease-in-out;
 +
  transition: all 0.35s 0.6s ease-in-out;
 +
}
 +
.ih-item.square.effect2 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  -webkit-transform: translateY(-200px);
 +
  -moz-transform: translateY(-200px);
 +
  -ms-transform: translateY(-200px);
 +
  -o-transform: translateY(-200px);
 +
  transform: translateY(-200px);
 +
  -webkit-transition: all 0.35s 0.5s linear;
 +
  -moz-transition: all 0.35s 0.5s linear;
 +
  transition: all 0.35s 0.5s linear;
 +
}
 +
.ih-item.square.effect2 a:hover .img {
 +
  -webkit-transform: rotate(720deg) scale(0);
 +
  -moz-transform: rotate(720deg) scale(0);
 +
  -ms-transform: rotate(720deg) scale(0);
 +
  -o-transform: rotate(720deg) scale(0);
 +
  transform: rotate(720deg) scale(0);
 +
  opacity: 0;
 +
}
 +
.ih-item.square.effect2 a:hover .info {
 +
  visibility: visible;
 +
}
 +
.ih-item.square.effect2 a:hover .info h3,
 +
.ih-item.square.effect2 a:hover .info p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect3 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect3.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect3 .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect3 .info {
 +
  height: 65px;
 +
  background: #333333;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect3 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px 10px 0 4px;
 +
  margin: 4px 0 0 0;
 +
}
 +
.ih-item.square.effect3 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 5px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect3 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect3.bottom_to_top .info {
 +
  top: auto;
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect3.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(-50px);
 +
  -moz-transform: translateY(-50px);
 +
  -ms-transform: translateY(-50px);
 +
  -o-transform: translateY(-50px);
 +
  transform: translateY(-50px);
 +
}
 +
.ih-item.square.effect3.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect3.top_to_bottom .info {
 +
  bottom: auto;
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect3.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(50px);
 +
  -moz-transform: translateY(50px);
 +
  -ms-transform: translateY(50px);
 +
  -o-transform: translateY(50px);
 +
  transform: translateY(50px);
 +
}
 +
.ih-item.square.effect3.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect4 {
 +
  overflow: hidden;
 +
  position: relative;
 +
}
 +
.ih-item.square.effect4.colored .info {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect4.colored .mask1,
 +
.ih-item.square.effect4.colored .mask2 {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.square.effect4 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect4 .mask1,
 +
.ih-item.square.effect4 .mask2 {
 +
  position: absolute;
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  height: 361px;
 +
  width: 361px;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect4 .mask1 {
 +
  left: auto;
 +
  right: 0;
 +
  top: 0;
 +
  -webkit-transform: rotate(56.5deg) translateX(-180px);
 +
  -moz-transform: rotate(56.5deg) translateX(-180px);
 +
  -ms-transform: rotate(56.5deg) translateX(-180px);
 +
  -o-transform: rotate(56.5deg) translateX(-180px);
 +
  transform: rotate(56.5deg) translateX(-180px);
 +
  -webkit-transform-origin: 100% 0%;
 +
  -moz-transform-origin: 100% 0%;
 +
  -ms-transform-origin: 100% 0%;
 +
  -o-transform-origin: 100% 0%;
 +
  transform-origin: 100% 0%;
 +
}
 +
.ih-item.square.effect4 .mask2 {
 +
  top: auto;
 +
  bottom: 0;
 +
  left: 0;
 +
  -webkit-transform: rotate(56.5deg) translateX(180px);
 +
  -moz-transform: rotate(56.5deg) translateX(180px);
 +
  -ms-transform: rotate(56.5deg) translateX(180px);
 +
  -o-transform: rotate(56.5deg) translateX(180px);
 +
  transform: rotate(56.5deg) translateX(180px);
 +
  -webkit-transform-origin: 0% 100%;
 +
  -moz-transform-origin: 0% 100%;
 +
  -ms-transform-origin: 0% 100%;
 +
  -o-transform-origin: 0% 100%;
 +
  transform-origin: 0% 100%;
 +
}
 +
.ih-item.square.effect4 .info {
 +
  background: #111111;
 +
  height: 0;
 +
  visibility: hidden;
 +
  width: 361px;
 +
  -webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
 +
  -moz-transform: rotate(-33.5deg) translate(-112px, 166px);
 +
  -ms-transform: rotate(-33.5deg) translate(-112px, 166px);
 +
  -o-transform: rotate(-33.5deg) translate(-112px, 166px);
 +
  transform: rotate(-33.5deg) translate(-112px, 166px);
 +
  -webkit-transform-origin: 0% 100%;
 +
  -moz-transform-origin: 0% 100%;
 +
  -ms-transform-origin: 0% 100%;
 +
  -o-transform-origin: 0% 100%;
 +
  transform-origin: 0% 100%;
 +
  -webkit-transition: all 0.35s ease-in-out 0.35s;
 +
  -moz-transition: all 0.35s ease-in-out 0.35s;
 +
  transition: all 0.35s ease-in-out 0.35s;
 +
}
 +
.ih-item.square.effect4 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: transparent;
 +
  margin-top: 5px;
 +
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out 0.35s;
 +
  -moz-transition: all 0.35s ease-in-out 0.35s;
 +
  transition: all 0.35s ease-in-out 0.35s;
 +
}
 +
.ih-item.square.effect4 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out 0.35s;
 +
  -moz-transition: all 0.35s ease-in-out 0.35s;
 +
  transition: all 0.35s ease-in-out 0.35s;
 +
}
 +
.ih-item.square.effect4 a:hover .mask1 {
 +
  -webkit-transform: rotate(56.5deg) translateX(1px);
 +
  -moz-transform: rotate(56.5deg) translateX(1px);
 +
  -ms-transform: rotate(56.5deg) translateX(1px);
 +
  -o-transform: rotate(56.5deg) translateX(1px);
 +
  transform: rotate(56.5deg) translateX(1px);
 +
}
 +
.ih-item.square.effect4 a:hover .mask2 {
 +
  -webkit-transform: rotate(56.5deg) translateX(-1px);
 +
  -moz-transform: rotate(56.5deg) translateX(-1px);
 +
  -ms-transform: rotate(56.5deg) translateX(-1px);
 +
  -o-transform: rotate(56.5deg) translateX(-1px);
 +
  transform: rotate(56.5deg) translateX(-1px);
 +
}
 +
.ih-item.square.effect4 a:hover .info {
 +
  width: 300px;
 +
  height: 120px;
 +
  visibility: visible;
 +
  top: 40px;
 +
  -webkit-transform: rotate(0deg) translate(0, 0);
 +
  -moz-transform: rotate(0deg) translate(0, 0);
 +
  -ms-transform: rotate(0deg) translate(0, 0);
 +
  -o-transform: rotate(0deg) translate(0, 0);
 +
  transform: rotate(0deg) translate(0, 0);
 +
}
 +
.ih-item.square.effect4 a:hover .info h3,
 +
.ih-item.square.effect4 a:hover .info p {
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect5.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect5.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect5 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect5 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect5 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect5 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect5 a:hover .img {
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
  -webkit-transition-delay: 0;
 +
  -moz-transition-delay: 0;
 +
  transition-delay: 0;
 +
}
 +
.ih-item.square.effect5 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transform: scale(1) rotate(0deg);
 +
  -moz-transform: scale(1) rotate(0deg);
 +
  -ms-transform: scale(1) rotate(0deg);
 +
  -o-transform: scale(1) rotate(0deg);
 +
  transform: scale(1) rotate(0deg);
 +
  -webkit-transition-delay: 0.3s;
 +
  -moz-transition-delay: 0.3s;
 +
  transition-delay: 0.3s;
 +
}
 +
 +
.ih-item.square.effect5.left_to_right .info {
 +
  -webkit-transform: scale(0) rotate(-180deg);
 +
  -moz-transform: scale(0) rotate(-180deg);
 +
  -ms-transform: scale(0) rotate(-180deg);
 +
  -o-transform: scale(0) rotate(-180deg);
 +
  transform: scale(0) rotate(-180deg);
 +
}
 +
 +
.ih-item.square.effect5.right_to_left .info {
 +
  -webkit-transform: scale(0) rotate(180deg);
 +
  -moz-transform: scale(0) rotate(180deg);
 +
  -ms-transform: scale(0) rotate(180deg);
 +
  -o-transform: scale(0) rotate(180deg);
 +
  transform: scale(0) rotate(180deg);
 +
}
 +
 +
.ih-item.square.effect6 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect6.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.square.effect6.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect6 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect6 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect6 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect6 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  -webkit-transition: all 0.35s 0.1s linear;
 +
  -moz-transition: all 0.35s 0.1s linear;
 +
  transition: all 0.35s 0.1s linear;
 +
}
 +
.ih-item.square.effect6 a:hover .img {
 +
  -webkit-transform: scale(1.2);
 +
  -moz-transform: scale(1.2);
 +
  -ms-transform: scale(1.2);
 +
  -o-transform: scale(1.2);
 +
  transform: scale(1.2);
 +
}
 +
.ih-item.square.effect6 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect6.from_top_and_bottom .info h3 {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect6.from_top_and_bottom .info p {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect6.from_top_and_bottom a:hover .info h3,
 +
.ih-item.square.effect6.from_top_and_bottom a:hover .info p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect6.from_left_and_right .info h3 {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.square.effect6.from_left_and_right .info p {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.square.effect6.from_left_and_right a:hover .info h3,
 +
.ih-item.square.effect6.from_left_and_right a:hover .info p {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect6.top_to_bottom .info h3 {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect6.top_to_bottom .info p {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect6.top_to_bottom a:hover .info h3,
 +
.ih-item.square.effect6.top_to_bottom a:hover .info p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect6.bottom_to_top .info h3 {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect6.bottom_to_top .info p {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect6.bottom_to_top a:hover .info h3,
 +
.ih-item.square.effect6.bottom_to_top a:hover .info p {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect7 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect7.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.square.effect7.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect7 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect7 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect7 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
  -webkit-transform: scale(4);
 +
  -moz-transform: scale(4);
 +
  -ms-transform: scale(4);
 +
  -o-transform: scale(4);
 +
  transform: scale(4);
 +
  -webkit-transition: all 0.35s 0.1s ease-in-out;
 +
  -moz-transition: all 0.35s 0.1s ease-in-out;
 +
  transition: all 0.35s 0.1s ease-in-out;
 +
}
 +
.ih-item.square.effect7 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  -webkit-transform: scale(5);
 +
  -moz-transform: scale(5);
 +
  -ms-transform: scale(5);
 +
  -o-transform: scale(5);
 +
  transform: scale(5);
 +
  -webkit-transition: all 0.35s 0.3s linear;
 +
  -moz-transition: all 0.35s 0.3s linear;
 +
  transition: all 0.35s 0.3s linear;
 +
}
 +
.ih-item.square.effect7 a:hover .img {
 +
  -webkit-transform: scale(1.2);
 +
  -moz-transform: scale(1.2);
 +
  -ms-transform: scale(1.2);
 +
  -o-transform: scale(1.2);
 +
  transform: scale(1.2);
 +
}
 +
.ih-item.square.effect7 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
.ih-item.square.effect7 a:hover .info h3,
 +
.ih-item.square.effect7 a:hover .info p {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.square.effect8 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect8.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect8.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect8 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect8 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect8 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
  -webkit-transition: all 0.35s 0.1s ease-in-out;
 +
  -moz-transition: all 0.35s 0.1s ease-in-out;
 +
  transition: all 0.35s 0.1s ease-in-out;
 +
}
 +
.ih-item.square.effect8 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  -webkit-transition: all 0.35s 0.15s linear;
 +
  -moz-transition: all 0.35s 0.15s linear;
 +
  transition: all 0.35s 0.15s linear;
 +
}
 +
.ih-item.square.effect8 a:hover .img {
 +
  opacity: 0;
 +
}
 +
.ih-item.square.effect8 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect8.scale_up .img {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect8.scale_up .info {
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
}
 +
.ih-item.square.effect8.scale_up .info h3,
 +
.ih-item.square.effect8.scale_up .info p {
 +
  -webkit-transform: scale(0);
 +
  -moz-transform: scale(0);
 +
  -ms-transform: scale(0);
 +
  -o-transform: scale(0);
 +
  transform: scale(0);
 +
}
 +
.ih-item.square.effect8.scale_up a:hover .img {
 +
  -webkit-transform: scale(5);
 +
  -moz-transform: scale(5);
 +
  -ms-transform: scale(5);
 +
  -o-transform: scale(5);
 +
  transform: scale(5);
 +
}
 +
.ih-item.square.effect8.scale_up a:hover .info {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect8.scale_up a:hover .info h3,
 +
.ih-item.square.effect8.scale_up a:hover .info p {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.square.effect8.scale_down .img {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect8.scale_down .info {
 +
  -webkit-transform: scale(5);
 +
  -moz-transform: scale(5);
 +
  -ms-transform: scale(5);
 +
  -o-transform: scale(5);
 +
  transform: scale(5);
 +
}
 +
.ih-item.square.effect8.scale_down .info h3,
 +
.ih-item.square.effect8.scale_down .info p {
 +
  -webkit-transform: scale(5);
 +
  -moz-transform: scale(5);
 +
  -ms-transform: scale(5);
 +
  -o-transform: scale(5);
 +
  transform: scale(5);
 +
}
 +
.ih-item.square.effect8.scale_down a:hover .img {
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.square.effect8.scale_down a:hover .info {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect8.scale_down a:hover .info h3,
 +
.ih-item.square.effect8.scale_down a:hover .info p {
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.square.effect9 {
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.square.effect9.colored .info .info-back {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect9.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect9 .img {
 +
  position: relative;
 +
  z-index: 11;
 +
  -webkit-transition: all 0.5s ease-in-out;
 +
  -moz-transition: all 0.5s ease-in-out;
 +
  transition: all 0.5s ease-in-out;
 +
}
 +
.ih-item.square.effect9 .info {
 +
  z-index: 0;
 +
  -webkit-transform-style: preserve-3d;
 +
  -moz-transform-style: preserve-3d;
 +
  -ms-transform-style: preserve-3d;
 +
  -o-transform-style: preserve-3d;
 +
  transform-style: preserve-3d;
 +
}
 +
.ih-item.square.effect9 .info .info-back {
 +
  opacity: 1;
 +
  width: 100%;
 +
  height: 100%;
 +
  padding-top: 30px;
 +
  background: #333333;
 +
}
 +
.ih-item.square.effect9 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 0;
 +
}
 +
.ih-item.square.effect9 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
 +
.ih-item.square.effect9.left_to_right .img {
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.square.effect9.left_to_right a:hover .img {
 +
  -webkit-transform: rotate3d(0, 1, 0, 180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, 180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, 180deg);
 +
  -o-transform: rotate3d(0, 1, 0, 180deg);
 +
  transform: rotate3d(0, 1, 0, 180deg);
 +
}
 +
 +
.ih-item.square.effect9.right_to_left .img {
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.square.effect9.right_to_left a:hover .img {
 +
  -webkit-transform: rotate3d(0, 1, 0, -180deg);
 +
  -moz-transform: rotate3d(0, 1, 0, -180deg);
 +
  -ms-transform: rotate3d(0, 1, 0, -180deg);
 +
  -o-transform: rotate3d(0, 1, 0, -180deg);
 +
  transform: rotate3d(0, 1, 0, -180deg);
 +
}
 +
 +
.ih-item.square.effect9.top_to_bottom .img {
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.square.effect9.top_to_bottom a:hover .img {
 +
  -webkit-transform: rotate3d(1, 0, 0, -180deg);
 +
  -moz-transform: rotate3d(1, 0, 0, -180deg);
 +
  -ms-transform: rotate3d(1, 0, 0, -180deg);
 +
  -o-transform: rotate3d(1, 0, 0, -180deg);
 +
  transform: rotate3d(1, 0, 0, -180deg);
 +
}
 +
 +
.ih-item.square.effect9.bottom_to_top .img {
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.square.effect9.bottom_to_top a:hover .img {
 +
  -webkit-transform: rotate3d(1, 0, 0, 180deg);
 +
  -moz-transform: rotate3d(1, 0, 0, 180deg);
 +
  -ms-transform: rotate3d(1, 0, 0, 180deg);
 +
  -o-transform: rotate3d(1, 0, 0, 180deg);
 +
  transform: rotate3d(1, 0, 0, 180deg);
 +
}
 +
 +
.ih-item.square.effect10 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect10.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect10.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect10 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect10 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect10 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect10 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect10 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect10.left_to_right .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.square.effect10.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.square.effect10.left_to_right a:hover .img {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.square.effect10.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect10.right_to_left .img {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
.ih-item.square.effect10.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.square.effect10.right_to_left a:hover .img {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.square.effect10.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect10.top_to_bottom .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.square.effect10.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect10.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect10.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect10.bottom_to_top .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.square.effect10.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect10.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect10.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect11 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect11.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect11.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect11 .img {
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect11 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease 0.2s;
 +
  -moz-transition: all 0.35s ease 0.2s;
 +
  transition: all 0.35s ease 0.2s;
 +
}
 +
.ih-item.square.effect11 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect11 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect11 a:hover .img {
 +
  opacity: 0;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.square.effect11 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect11.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.square.effect11.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect11.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.square.effect11.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect11.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect11.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect11.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect11.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect12 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect12.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.square.effect12.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect12 .img {
 +
  -webkit-transition: all 0.35s ease-in;
 +
  -moz-transition: all 0.35s ease-in;
 +
  transition: all 0.35s ease-in;
 +
}
 +
.ih-item.square.effect12 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in;
 +
  -moz-transition: all 0.35s ease-in;
 +
  transition: all 0.35s ease-in;
 +
}
 +
.ih-item.square.effect12 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
  -webkit-transition: all 0.35s ease-in;
 +
  -moz-transition: all 0.35s ease-in;
 +
  transition: all 0.35s ease-in;
 +
}
 +
.ih-item.square.effect12 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
  -webkit-transition: all 0.35s ease-in;
 +
  -moz-transition: all 0.35s ease-in;
 +
  transition: all 0.35s ease-in;
 +
}
 +
.ih-item.square.effect12 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transition-delay: 0.2s;
 +
  -moz-transition-delay: 0.2s;
 +
  transition-delay: 0.2s;
 +
}
 +
.ih-item.square.effect12 a:hover .info h3 {
 +
  -webkit-transition-delay: 0.3s;
 +
  -moz-transition-delay: 0.3s;
 +
  transition-delay: 0.3s;
 +
}
 +
.ih-item.square.effect12 a:hover .info p {
 +
  -webkit-transition-delay: 0.25s;
 +
  -moz-transition-delay: 0.25s;
 +
  transition-delay: 0.25s;
 +
}
 +
 +
.ih-item.square.effect12.left_to_right .info {
 +
  -webkit-transform: translate(-460px, -100px) rotate(-180deg);
 +
  -moz-transform: translate(-460px, -100px) rotate(-180deg);
 +
  -ms-transform: translate(-460px, -100px) rotate(-180deg);
 +
  -o-transform: translate(-460px, -100px) rotate(-180deg);
 +
  transform: translate(-460px, -100px) rotate(-180deg);
 +
}
 +
.ih-item.square.effect12.left_to_right .info h3 {
 +
  -webkit-transform: translateY(-100px);
 +
  -moz-transform: translateY(-100px);
 +
  -ms-transform: translateY(-100px);
 +
  -o-transform: translateY(-100px);
 +
  transform: translateY(-100px);
 +
}
 +
.ih-item.square.effect12.left_to_right .info p {
 +
  -webkit-transform: translateX(-300px) rotate(-90deg);
 +
  -moz-transform: translateX(-300px) rotate(-90deg);
 +
  -ms-transform: translateX(-300px) rotate(-90deg);
 +
  -o-transform: translateX(-300px) rotate(-90deg);
 +
  transform: translateX(-300px) rotate(-90deg);
 +
}
 +
.ih-item.square.effect12.left_to_right a:hover .info {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
}
 +
.ih-item.square.effect12.left_to_right a:hover .info h3 {
 +
  -webkit-transform: translateY(0px);
 +
  -moz-transform: translateY(0px);
 +
  -ms-transform: translateY(0px);
 +
  -o-transform: translateY(0px);
 +
  transform: translateY(0px);
 +
}
 +
.ih-item.square.effect12.left_to_right a:hover .info p {
 +
  -webkit-transform: translateX(0px) rotate(0deg);
 +
  -moz-transform: translateX(0px) rotate(0deg);
 +
  -ms-transform: translateX(0px) rotate(0deg);
 +
  -o-transform: translateX(0px) rotate(0deg);
 +
  transform: translateX(0px) rotate(0deg);
 +
}
 +
 +
.ih-item.square.effect12.right_to_left .info {
 +
  -webkit-transform: translate(460px, -100px) rotate(180deg);
 +
  -moz-transform: translate(460px, -100px) rotate(180deg);
 +
  -ms-transform: translate(460px, -100px) rotate(180deg);
 +
  -o-transform: translate(460px, -100px) rotate(180deg);
 +
  transform: translate(460px, -100px) rotate(180deg);
 +
}
 +
.ih-item.square.effect12.right_to_left .info h3 {
 +
  -webkit-transform: translateY(-100px);
 +
  -moz-transform: translateY(-100px);
 +
  -ms-transform: translateY(-100px);
 +
  -o-transform: translateY(-100px);
 +
  transform: translateY(-100px);
 +
}
 +
.ih-item.square.effect12.right_to_left .info p {
 +
  -webkit-transform: translateX(300px) rotate(90deg);
 +
  -moz-transform: translateX(300px) rotate(90deg);
 +
  -ms-transform: translateX(300px) rotate(90deg);
 +
  -o-transform: translateX(300px) rotate(90deg);
 +
  transform: translateX(300px) rotate(90deg);
 +
}
 +
.ih-item.square.effect12.right_to_left a:hover .info {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
}
 +
.ih-item.square.effect12.right_to_left a:hover .info h3 {
 +
  -webkit-transform: translateY(0px);
 +
  -moz-transform: translateY(0px);
 +
  -ms-transform: translateY(0px);
 +
  -o-transform: translateY(0px);
 +
  transform: translateY(0px);
 +
}
 +
.ih-item.square.effect12.right_to_left a:hover .info p {
 +
  -webkit-transform: translateX(0px) rotate(0deg);
 +
  -moz-transform: translateX(0px) rotate(0deg);
 +
  -ms-transform: translateX(0px) rotate(0deg);
 +
  -o-transform: translateX(0px) rotate(0deg);
 +
  transform: translateX(0px) rotate(0deg);
 +
}
 +
 +
.ih-item.square.effect12.top_to_bottom .info {
 +
  -webkit-transform: translate(-265px, -145px) rotate(-45deg);
 +
  -moz-transform: translate(-265px, -145px) rotate(-45deg);
 +
  -ms-transform: translate(-265px, -145px) rotate(-45deg);
 +
  -o-transform: translate(-265px, -145px) rotate(-45deg);
 +
  transform: translate(-265px, -145px) rotate(-45deg);
 +
}
 +
.ih-item.square.effect12.top_to_bottom .info h3 {
 +
  -webkit-transform: translate(200px, -200px);
 +
  -moz-transform: translate(200px, -200px);
 +
  -ms-transform: translate(200px, -200px);
 +
  -o-transform: translate(200px, -200px);
 +
  transform: translate(200px, -200px);
 +
}
 +
.ih-item.square.effect12.top_to_bottom .info p {
 +
  -webkit-transform: translate(200px, -200px);
 +
  -moz-transform: translate(200px, -200px);
 +
  -ms-transform: translate(200px, -200px);
 +
  -o-transform: translate(200px, -200px);
 +
  transform: translate(200px, -200px);
 +
}
 +
.ih-item.square.effect12.top_to_bottom a:hover .info {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.2s;
 +
  -moz-transition-delay: 0.2s;
 +
  transition-delay: 0.2s;
 +
}
 +
.ih-item.square.effect12.top_to_bottom a:hover .info h3 {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.3s;
 +
  -moz-transition-delay: 0.3s;
 +
  transition-delay: 0.3s;
 +
}
 +
.ih-item.square.effect12.top_to_bottom a:hover .info p {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.square.effect12.bottom_to_top .info {
 +
  -webkit-transform: translate(265px, 145px) rotate(45deg);
 +
  -moz-transform: translate(265px, 145px) rotate(45deg);
 +
  -ms-transform: translate(265px, 145px) rotate(45deg);
 +
  -o-transform: translate(265px, 145px) rotate(45deg);
 +
  transform: translate(265px, 145px) rotate(45deg);
 +
}
 +
.ih-item.square.effect12.bottom_to_top .info h3 {
 +
  -webkit-transform: translate(200px, -200px);
 +
  -moz-transform: translate(200px, -200px);
 +
  -ms-transform: translate(200px, -200px);
 +
  -o-transform: translate(200px, -200px);
 +
  transform: translate(200px, -200px);
 +
}
 +
.ih-item.square.effect12.bottom_to_top .info p {
 +
  -webkit-transform: translate(-200px, 200px);
 +
  -moz-transform: translate(-200px, 200px);
 +
  -ms-transform: translate(-200px, 200px);
 +
  -o-transform: translate(-200px, 200px);
 +
  transform: translate(-200px, 200px);
 +
}
 +
.ih-item.square.effect12.bottom_to_top a:hover .info {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.2s;
 +
  -moz-transition-delay: 0.2s;
 +
  transition-delay: 0.2s;
 +
}
 +
.ih-item.square.effect12.bottom_to_top a:hover .info h3 {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.3s;
 +
  -moz-transition-delay: 0.3s;
 +
  transition-delay: 0.3s;
 +
}
 +
.ih-item.square.effect12.bottom_to_top a:hover .info p {
 +
  -webkit-transform: translate(0px, 0px);
 +
  -moz-transform: translate(0px, 0px);
 +
  -ms-transform: translate(0px, 0px);
 +
  -o-transform: translate(0px, 0px);
 +
  transform: translate(0px, 0px);
 +
  -webkit-transition-delay: 0.4s;
 +
  -moz-transition-delay: 0.4s;
 +
  transition-delay: 0.4s;
 +
}
 +
 +
.ih-item.square.effect13 {
 +
  overflow: hidden;
 +
}
 +
.ih-item.square.effect13.colored .info {
 +
  background: #1a4a72;
 +
  background: rgba(26, 74, 114, 0.6);
 +
}
 +
.ih-item.square.effect13.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect13 .img {
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
.ih-item.square.effect13 .info {
 +
  background: #333333;
 +
  background: rgba(0, 0, 0, 0.6);
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect13 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect13 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect13 a:hover .img {
 +
  -webkit-transform: scale(1.2);
 +
  -moz-transform: scale(1.2);
 +
  -ms-transform: scale(1.2);
 +
  -o-transform: scale(1.2);
 +
  transform: scale(1.2);
 +
}
 +
.ih-item.square.effect13 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect13.left_to_right .info {
 +
  -webkit-transform: translateX(-100%);
 +
  -moz-transform: translateX(-100%);
 +
  -ms-transform: translateX(-100%);
 +
  -o-transform: translateX(-100%);
 +
  transform: translateX(-100%);
 +
}
 +
.ih-item.square.effect13.left_to_right a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect13.right_to_left .info {
 +
  -webkit-transform: translateX(100%);
 +
  -moz-transform: translateX(100%);
 +
  -ms-transform: translateX(100%);
 +
  -o-transform: translateX(100%);
 +
  transform: translateX(100%);
 +
}
 +
.ih-item.square.effect13.right_to_left a:hover .info {
 +
  -webkit-transform: translateX(0);
 +
  -moz-transform: translateX(0);
 +
  -ms-transform: translateX(0);
 +
  -o-transform: translateX(0);
 +
  transform: translateX(0);
 +
}
 +
 +
.ih-item.square.effect13.top_to_bottom .info {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
.ih-item.square.effect13.top_to_bottom a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect13.bottom_to_top .info {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
.ih-item.square.effect13.bottom_to_top a:hover .info {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
 +
.ih-item.square.effect14.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect14.colored .info h3 {
 +
  background: rgba(12, 34, 52, 0.6);
 +
}
 +
.ih-item.square.effect14 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.35s ease-in-out;
 +
  -moz-transition: all 0.35s ease-in-out;
 +
  transition: all 0.35s ease-in-out;
 +
}
 +
.ih-item.square.effect14 .info {
 +
  background: #333333;
 +
  visibility: hidden;
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
  -webkit-transition: all 0.35s ease 0.2s;
 +
  -moz-transition: all 0.35s ease 0.2s;
 +
  transition: all 0.35s ease 0.2s;
 +
}
 +
.ih-item.square.effect14 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect14 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect14 a:hover .img {
 +
  opacity: 0;
 +
  pointer-events: none;
 +
  -webkit-transform: scale(0.5);
 +
  -moz-transform: scale(0.5);
 +
  -ms-transform: scale(0.5);
 +
  -o-transform: scale(0.5);
 +
  transform: scale(0.5);
 +
}
 +
.ih-item.square.effect14 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
  -webkit-transform: scale(1);
 +
  -moz-transform: scale(1);
 +
  -ms-transform: scale(1);
 +
  -o-transform: scale(1);
 +
  transform: scale(1);
 +
}
 +
 +
.ih-item.square.effect14.left_to_right .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.square.effect14.left_to_right a:hover .img {
 +
  -webkit-transform: translateX(100%) rotate(180deg);
 +
  -moz-transform: translateX(100%) rotate(180deg);
 +
  -ms-transform: translateX(100%) rotate(180deg);
 +
  -o-transform: translateX(100%) rotate(180deg);
 +
  transform: translateX(100%) rotate(180deg);
 +
}
 +
 +
.ih-item.square.effect14.right_to_left .img {
 +
  -webkit-transform: translateX(0) rotate(0);
 +
  -moz-transform: translateX(0) rotate(0);
 +
  -ms-transform: translateX(0) rotate(0);
 +
  -o-transform: translateX(0) rotate(0);
 +
  transform: translateX(0) rotate(0);
 +
}
 +
.ih-item.square.effect14.right_to_left a:hover .img {
 +
  -webkit-transform: translateX(-100%) rotate(-180deg);
 +
  -moz-transform: translateX(-100%) rotate(-180deg);
 +
  -ms-transform: translateX(-100%) rotate(-180deg);
 +
  -o-transform: translateX(-100%) rotate(-180deg);
 +
  transform: translateX(-100%) rotate(-180deg);
 +
}
 +
 +
.ih-item.square.effect14.top_to_bottom .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.square.effect14.top_to_bottom a:hover .img {
 +
  -webkit-transform: translateY(-100%);
 +
  -moz-transform: translateY(-100%);
 +
  -ms-transform: translateY(-100%);
 +
  -o-transform: translateY(-100%);
 +
  transform: translateY(-100%);
 +
}
 +
 +
.ih-item.square.effect14.bottom_to_top .img {
 +
  -webkit-transform: translateY(0);
 +
  -moz-transform: translateY(0);
 +
  -ms-transform: translateY(0);
 +
  -o-transform: translateY(0);
 +
  transform: translateY(0);
 +
}
 +
.ih-item.square.effect14.bottom_to_top a:hover .img {
 +
  -webkit-transform: translateY(100%);
 +
  -moz-transform: translateY(100%);
 +
  -ms-transform: translateY(100%);
 +
  -o-transform: translateY(100%);
 +
  transform: translateY(100%);
 +
}
 +
 +
.ih-item.square.effect15 {
 +
  overflow: hidden;
 +
  -webkit-perspective: 900px;
 +
  -moz-perspective: 900px;
 +
  perspective: 900px;
 +
}
 +
.ih-item.square.effect15.colored .info {
 +
  background: #1a4a72;
 +
}
 +
.ih-item.square.effect15 .img {
 +
  opacity: 1;
 +
  -webkit-transition: all 0.4s ease-in-out;
 +
  -moz-transition: all 0.4s ease-in-out;
 +
  transition: all 0.4s ease-in-out;
 +
}
 +
.ih-item.square.effect15 .info {
 +
  background: #333333;
 +
  opacity: 0;
 +
  -webkit-transition: all 0.35s ease-in-out 0.3s;
 +
  -moz-transition: all 0.35s ease-in-out 0.3s;
 +
  transition: all 0.35s ease-in-out 0.3s;
 +
}
 +
.ih-item.square.effect15 .info h3 {
 +
  text-transform: uppercase;
 +
  color: #fff;
 +
  text-align: center;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background: #111111;
 +
  margin: 30px 0 0 0;
 +
}
 +
.ih-item.square.effect15 .info p {
 +
  font-style: italic;
 +
  font-size: 12px;
 +
  position: relative;
 +
  color: #bbb;
 +
  padding: 20px 20px 20px;
 +
  text-align: center;
 +
}
 +
.ih-item.square.effect15 a:hover .img {
 +
  opacity: 0;
 +
  visibility: hidden;
 +
}
 +
.ih-item.square.effect15 a:hover .info {
 +
  visibility: visible;
 +
  opacity: 1;
 +
}
 +
 +
.ih-item.square.effect15.left_to_right .img {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.square.effect15.left_to_right .info {
 +
  -webkit-transform: rotateY(90deg);
 +
  -moz-transform: rotateY(90deg);
 +
  -ms-transform: rotateY(90deg);
 +
  -o-transform: rotateY(90deg);
 +
  transform: rotateY(90deg);
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.square.effect15.left_to_right a:hover .img {
 +
  -webkit-transform: rotateY(-90deg);
 +
  -moz-transform: rotateY(-90deg);
 +
  -ms-transform: rotateY(-90deg);
 +
  -o-transform: rotateY(-90deg);
 +
  transform: rotateY(-90deg);
 +
}
 +
.ih-item.square.effect15.left_to_right a:hover .info {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
}
 +
 +
.ih-item.square.effect15.right_to_left .img {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
  -webkit-transform-origin: 0% 50%;
 +
  -moz-transform-origin: 0% 50%;
 +
  -ms-transform-origin: 0% 50%;
 +
  -o-transform-origin: 0% 50%;
 +
  transform-origin: 0% 50%;
 +
}
 +
.ih-item.square.effect15.right_to_left .info {
 +
  -webkit-transform: rotateY(-90deg);
 +
  -moz-transform: rotateY(-90deg);
 +
  -ms-transform: rotateY(-90deg);
 +
  -o-transform: rotateY(-90deg);
 +
  transform: rotateY(-90deg);
 +
  -webkit-transform-origin: 100% 50%;
 +
  -moz-transform-origin: 100% 50%;
 +
  -ms-transform-origin: 100% 50%;
 +
  -o-transform-origin: 100% 50%;
 +
  transform-origin: 100% 50%;
 +
}
 +
.ih-item.square.effect15.right_to_left a:hover .img {
 +
  -webkit-transform: rotateY(90deg);
 +
  -moz-transform: rotateY(90deg);
 +
  -ms-transform: rotateY(90deg);
 +
  -o-transform: rotateY(90deg);
 +
  transform: rotateY(90deg);
 +
}
 +
.ih-item.square.effect15.right_to_left a:hover .info {
 +
  -webkit-transform: rotateY(0);
 +
  -moz-transform: rotateY(0);
 +
  -ms-transform: rotateY(0);
 +
  -o-transform: rotateY(0);
 +
  transform: rotateY(0);
 +
}
 +
 +
.ih-item.square.effect15.top_to_bottom .img {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.square.effect15.top_to_bottom .info {
 +
  -webkit-transform: rotateX(-90deg);
 +
  -moz-transform: rotateX(-90deg);
 +
  -ms-transform: rotateX(-90deg);
 +
  -o-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.square.effect15.top_to_bottom a:hover .img {
 +
  -webkit-transform: rotateX(90deg);
 +
  -moz-transform: rotateX(90deg);
 +
  -ms-transform: rotateX(90deg);
 +
  -o-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
}
 +
.ih-item.square.effect15.top_to_bottom a:hover .info {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
}
 +
 +
.ih-item.square.effect15.bottom_to_top .img {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
  -webkit-transform-origin: 50% 0;
 +
  -moz-transform-origin: 50% 0;
 +
  -ms-transform-origin: 50% 0;
 +
  -o-transform-origin: 50% 0;
 +
  transform-origin: 50% 0;
 +
}
 +
.ih-item.square.effect15.bottom_to_top .info {
 +
  -webkit-transform: rotateX(90deg);
 +
  -moz-transform: rotateX(90deg);
 +
  -ms-transform: rotateX(90deg);
 +
  -o-transform: rotateX(90deg);
 +
  transform: rotateX(90deg);
 +
  -webkit-transform-origin: 50% 100%;
 +
  -moz-transform-origin: 50% 100%;
 +
  -ms-transform-origin: 50% 100%;
 +
  -o-transform-origin: 50% 100%;
 +
  transform-origin: 50% 100%;
 +
}
 +
.ih-item.square.effect15.bottom_to_top a:hover .img {
 +
  -webkit-transform: rotateX(-90deg);
 +
  -moz-transform: rotateX(-90deg);
 +
  -ms-transform: rotateX(-90deg);
 +
  -o-transform: rotateX(-90deg);
 +
  transform: rotateX(-90deg);
 +
}
 +
.ih-item.square.effect15.bottom_to_top a:hover .info {
 +
  -webkit-transform: rotateX(0);
 +
  -moz-transform: rotateX(0);
 +
  -ms-transform: rotateX(0);
 +
  -o-transform: rotateX(0);
 +
  transform: rotateX(0);
 +
}
 +
 
</style>
 
</style>
 
<script>  
 
<script>  

Revision as of 07:34, 4 October 2017

HKUST iGEM Team 2017

Alvin Riva, KUSUMA
The adventurer
Despite his love for messsaging, he sometimes shares food with his e.coli pets when he wants to know how it double distilled water taste like.
Devi Natalie, NADJAJA
The calligrapher.
She is able to write very neatly and beautifully, as if it is a font printed by the computer. Reading log book hand-written by her can surely put you in a good mood before you start your experiment of the day.
Tsz Man CHEUNG, David
The main contact person for human practice in the team.
He is a very sociable person who is not shy to contact people from other teams or the professionals.
Handi, YANG
The Mandarin translator in Human Practice
Using her plentiful knowledge in both Chinese and Biology, she made the production for the chinese version of Synthetic Biology 101 videos a lot smoother. SHe is also the only girl in Recombination module!
Chen PENG,Harold
The perfectionist
You can spot this out once you step into the lab. He is the only person who wears lab coat and uses camera to keep track of what he has done. Though it will be more professional if he wears an extra pair of safety goggles.
Lok Man CHAN,Jenny
Our main artist
Also the core iGEM memes developer. She is very enthusiastic in the lab and project development, but can also fall asleep anytime during her free time.
Wai Yan LO,Kapher
The automatic "laugh-generator".
Whenever she's here, the lab will be full of laughters and her loud voice. Being an energetic person, she will yell "Yo! Let's goooo!!!" when our lab day begins.
Kin Yung CHAU,Ken
The original project designer in charge of our Sensing module
He is known for being the "Cha-siu" (barbeque pork in chinese) of our lab as this is the way he says "I trust you". With all his trust for the team, we also calls him a god who never gets angry.
Sirinant KHUNAKORNBODINTR,Katie
The promoter of our team
She is a very strong promoter who does not only strive for the best of herself, but she will also make sure that everyone completes their work to the best of their ability.
Ora-in CHU,Kelly
A secretary who needs faster typing skills
She is a very committed member in our team. You can tell because you will always see her present in the lab already early in the morning! She also needs to help our time-delay module to keep track of petri dishes (as there are too many!!!)
Tsz Chun KWOK,Marco
The pokered-faced comedian
Being an introvert, he seldom speaks. However when he does, he always hits the nail on the head. He will never laugh to whatever jokes he was making. That is what make us think he is so funny all the time!
On Yiu CHEUNG,Nicole
The efficient helper
She is very willing to offer help to every members in the team and she will try to finish the work people assigned to her as soon as possible. Apart from the lab work, what she enjoys the most is socializing with kids in the HKSTP science fair.
Ka Wing YUEN,Gary
The original project designer in charge of our Recombinase module
He's a slave driver that always emphasizes the importance of having a negative control, even when we hold experiment workshops to primary school children in the HKSTP science fair.
Yuen Tung LI,Yolanda
The Snacks Secretary
She is an extraordinary secretary who takes her job one step further by always making sure we have enough snacks to survive our daily work. She likes eating but always complains about eating too much.
Phoomraphee, LUENAM
The math and IT support center of the team
He is a genius guy who can explain those complicated modelling stuffs to us very clearly. He is a very nice person to talk to and from what we all gathered, he is a cat person and likes eating salmon very much.
Vincentius Mario, PURNAMA

"Kekanak-kanakan" (means Childish in Indonesian) is the only word he taught in Indonesian and we still cannot spell and pronounce it correctly.
Marcel, SANTOSO
The calmest member of the team
He is the best representative for the word "Santuirrrrrrrrrrrr" (means Calm Down in Indonesian), and also one of the first person who you will see in the lab each day.
Zhong CHAU,Belkis

Wun Kwan YAM,William

The "radio reporter" of the team.
With his perfect tone in both english and cantonese, he will always be chosen whenever we need a good voice (Especially for the weekly presentations and voice-over for our "Synthetic biology 1" videos).

Sheldon

Our greatest teacher available for public education on synthetic biology and biosafety. He can also keep the lab in a relaxed atmosphere by joking around

Martin

The "radio reporter" of the team.
With his perfect tone in both english and cantonese, he will always be chosen whenever we need a good voice (Especially for the weekly presentations and voice-over for our "Synthetic biology 1" videos).

Our Advisors

img

Heading here

Description goes here

img

Heading here

Description goes here

img

Heading here

Description goes here

img

Heading here

Description goes here

img

Heading here

Description goes here

img

Heading here

Description goes here


Footer