/* Minification failed. Returning unminified contents.
(829,15): run-time error CSS1036: Expected expression, found ';'
(936,17): run-time error CSS1036: Expected expression, found ';'
(1193,1): run-time error CSS1019: Unexpected token, found '}'
(2492,17): run-time error CSS1036: Expected expression, found ';'
(2883,11): run-time error CSS1036: Expected expression, found ';'
(3158,20): run-time error CSS1036: Expected expression, found ';'
(3244,14): run-time error CSS1036: Expected expression, found ';'
(3358,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(3360,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(3933,19): run-time error CSS1036: Expected expression, found ';'
(4020,14): run-time error CSS1036: Expected expression, found ';'
(4607,17): run-time error CSS1036: Expected expression, found ';'
(5056,11): run-time error CSS1036: Expected expression, found ';'
(5285,21): run-time error CSS1036: Expected expression, found ';'
(5599,15): run-time error CSS1036: Expected expression, found ';'
 */



h4, h5, h6,
h1, h2, h3 {margin: 0;}
ul, ol {margin: 0;}
p {margin: 0;}
html, body{
font-family: 'Microsoft YaHei';
   font-size: 100%;
   background:#fff; 
}
.col-sm-9 p{
    font-size:14px;
}
a {
  text-decoration: none;
}
a:hover {
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
}
b{
    color:rgba(0,0,0,0.1);
}
@font-face {
    font-family: 'Hind-Regular';
    src:url(../fonts/Hind-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'raleway';
    src:url(../fonts/Raleway-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'chalk';
    src:url(../fonts/SqueakyChalkSound.ttf) format('truetype');
}
@font-face {
	font-family: 'MontserratAlternates-Regular';
    src:url(../fonts/MontserratAlternates-Regular.ttf) format('truetype');
}
/*--header start here--*/
.lower_menu{
    background-color:#044772;
    height:30px;
    color:white;

}
.header-strip {
  background: url(../images/strip.png);
  min-height: 2px;
}
.header {
  padding: 2em 0em 2em 0em;
}
span.menu {
  display: none;
}
.logo h1 {
  font-size: 3em;
  text-align: center;
  font-family: 'MontserratAlternates-Regular';
}
.logo h1 a {
  color:#f8565d;
}
.logo h1 a:hover{
  text-decoration:none;	
}

header{
        transition:top 0.5s ease-in-out;
}


.navg-strip {
  background: rgba(0,116,157,0.9) ;
  padding: 0px 0em 0em 0em;
  border-top:0px double #EDEDED;
   transition:top 0.5s ease-in-out;
   top:0px;
  height:120px;
  z-index:3;
  position:fixed;
  width:100vw;
}



.navg-strip2 {
   background-color:rgba(0,116,157,0.7);
   padding: 5px 0em 0em 0em;
   border-top:0px double #EDEDED;
   transition:top 0.5s ease-in-out;
   top:0px;
   position:fixed;
   height:45px;
   width:100vw;
   z-index:3;
   display:none;
}
.main-logo{
    transition:opacity 1s ease-in-out;
}
.main-logo.dis2{
  opacity:0;
}
.enroll-now.dis3{
    text-decoration:none;
  opacity:0.5;
}

.menu img{
    margin-top:30px;
    width:22px;
        margin-right: 30px;
}
.enroll-now{
      transition:opacity 0.5s ease-in-out;
    padding:6px 8px 6px 8px;
    color:white;
    position:fixed;
    right:1%;
    top:17px;
     z-index:3;
     text-decoration:none;
     border:1px solid orange;
     border-radius:10px;
}

.enroll-now:hover{
    background:orange;
    padding:3px 4px 3px 4px;
    opacity:0.7;
    color:#004669;
    cursor:pointer;
    text-decoration:none;
}

.navg-strip.dis{
    top:-45px;
   
}

.dis{
    top:-45px;
    
}

.nav-up {
  opacity:0;
  
}

.top-nav {
  float: right;
  width: 86%;
}
.top-nav ul {
  float:right;
  list-style: none;
}
.top-nav ul li {
     display: inline-block;
     padding:0em 0.75em 0em 0.75em;
     /* height:90px; */
     float: right;
}
.top-nav ul li a {
    height:100%;
    width:100%;
    vertical-align:middle;
  font-size: 20px;
  color: #FFF;
  font-family:  arial,tahoma,'Microsoft Yahei','\5b8b\4f53',sans-serif;
  letter-spacing: -0.5px;
  text-transform: uppercase;
  display:block;
}
.top-nav ul li:hover {
    cursor:pointer;
  text-decoration:none;
  background-color:rgba(0,116,157,0.5);
}

.top-nav ul li a:hover {
  text-decoration:none;
}


form.navbar-right li a {
    font-size: 15px;
}
.header-right {
  float: right;
  width: 13%;
}
.social-icons {
  float: right;
}
.social-icons ul {
  padding: 0em 0.4em 0em 0em;
  list-style: none;
  border-right: 1px solid #000;
}
.social-icons ul li {
  display: inline-block;
  margin:0em 0.5em 0em 0em;
}
.social-icons ul li a span{
  background: url(../images/social-icons.png)no-repeat;
  width: 21px;
  height: 21px;
  display: block;
}
.social-icons ul li a span.fa {
  background-position: 7px 0px;
}
.social-icons ul li a span.tw {
  background-position: -16px 0px;
}
.social-icons ul li a span.g {
  background-position: -39px 0px;
}
.social-icons ul li a span.in {
  background-position: -61px 0px;
}
.social-icons ul li a span.pin {
  background-position: -83px 0px;
}
.social-icons ul li a span.you {
  background-position: -105px 0px;
}
.social-icons ul li a span.fa:hover {
  background-position: 7px -22px;
}
.social-icons ul li a span.tw:hover{
  background-position: -16px -22px;
}
.social-icons ul li a span.g:hover {
  background-position: -39px -22px;
}
.social-icons ul li a span.in:hover {
  background-position: -61px -22px;
}
.social-icons ul li a span.pin:hover {
  background-position: -83px -22px;
}
.social-icons ul li a span.you:hover {
  background-position: -105px -22px;
}
/*--search--*/
.search-in{
	float: right;
	position: relative;
}
.search{
	position: absolute;
	top: 65px;
  	display: block;
  	z-index: 100;
  	background-color:rgba(0,116,157,1);
	width: 306px;
	right: 0;
	padding: 1em;
}
.search input[type=text]{
	background:none;
	padding:7px;
	width:70%;
	font-size:0.9em;
	color:#fff;
	-webkit-appearance: none;
	border: 1px solid #fff;
	outline: none;
}
.search input[type=submit]{
	background:#2A2828;
	padding:9px 10px;
	width:25%;
	font-size:0.88em;
	color:#fff;
	-webkit-appearance: none;
	border: none;
	outline: none;
	position: absolute;
  top: 16px;
}
.search input[type=text]:focus{
	color:#5d5d5d;
}

.close-in{
	position: absolute;
	top: -22px;
	right: 0px;
	cursor: pointer;
	  background-color:rgba(0,116,157,1);
	  padding: 4px;
}
.right button {
	cursor: pointer;
	font-size: .8em;
	color: #777;
	position: absolute;
	bottom: 0;
	top:0px;
	right: 0px;
	border: none;
	outline: none;
	  background: url('../images/search.png') no-repeat 0px ;
	  width: 25px;
	  height: 25px;
	  padding: 0;
}
/*--banner start here--*/
.main-page-title{
     font-size:35px;
    font-family:'raleway';
    color:#00749D;

}

.home-icon-title{
     font-family:'Microsoft YaHei';
    text-align:center;
    font-size:20px;
    color:#00749D;
    margin-top:10px;
    font-weight:bold;
}

.home-icon-content{
     font-family:'Microsoft YaHei';
    text-align:center;
    font-size:16px;
    color:#00749D;
    margin-top:0px;
    font-weight:normal;
    padding:30px;
}

.home-icons{
    margin-top:30px;

}

.main-page-title-intro{
    max-width:600px;
}

.main-page-title-intro-style{
    margin-top:25px;
    max-width:600px;
    font-family:'Microsoft YaHei';
    text-align:center;
    font-size:16px;
    color:#00749D;
}

chinese{
font-family:'Microsoft YaHei';
}

.about-right{
    padding-top:50px;
    padding-bottom:30px;
    background-color:rgba(0,116,157,1);

}
.banner {
    padding: 8em 0em 8em 0em;
    background: url('../images/moocys/library_banner.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin-top:120px;
    height:95vh;
}
.banner-main {
  padding: 15em 0em 0em 0em;
  text-align: center;
}
.banner-main h2 {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 3em;
  color: #fff;
  padding-top:200px;
  font-family: 'Microsoft YaHei UI';
}
.banner-main p {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 1.5em;
  color: #fff;
  font-family:'raleway';
}
.banner-grid p{
margin-top:50px;
color:white;
font-weight:bold;
font-size:20px;

}
.banner-title{
  color:white;font-size:9vw;font-family:'raleway';font-weight:bolder;letter-spacing:3px;
}
.banner-p{
    color:white;font-size:20px;font-family:'Microsoft YaHei UI';font-weight:100;line-height:1.2em;
    margin:0 10vw 0 10vw;
}
.about-photo{
    margin-bottom:20px;
}
.about-email{
  color: white;
  font-family: helvetica;
  font-size: 13px;
     font-family:'raleway'; 
}
.banner-about {
  background: url(../images/about/about-1.jpg)no-repeat center;
  min-height:55vh;
  height: 350px;
  background-size: cover;
  margin-top:120px;
}
.moocys-about {
  background: url(../images/moocys/lib.jpg)no-repeat center;
  min-height:55vh;
  height: 350px;
  background-size: cover;
  margin-top:120px;
}
.banner-team-photo {
  background: url(../images/about/about-team-long.jpg)no-repeat center;
  height: 600px;
  background-size: cover;
}
.banner-about-main {
  padding: 3em 0em 0em 0em;
  text-align: center;
}
.banner-about-main h2 {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 2em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}
.banner-about-main h3 {
  padding-top:10px;
  text-shadow: 2px 4px 3px rgba(0,0,0,0.7);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 1.5em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}
.banner-about-main p {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 1em;
  color: #fff;
}
.about-row {
    margin: 35px
}

#about-team-photo{
  max-height:300px;
  margin-bottom:30px;
}

#about-team-description{
    max-width:500px;
padding: 50px 50px 50px 50px;
    font-family:'Microsoft YaHei';
    font-size:18px;
}

#about-team-description p{
    max-width:500px;
    font-family:'Microsoft YaHei';
    font-size:18px;
}

#about-team-description h2{
    margin-top:10px;
    margin-bottom:10px;
    font-size:32px;
    font-weight:bold;
    font-family:raleway;
}
/*--banner end here--*/
/*--single--*/
.lone-line {
  padding: 2em 0em 0em 0em;
}
.single-grid{
	margin:0em 0 3em;
	background: #fff;
}
.single-grid h4{
	margin:0 0 0.3em;
	font-size:2em;
	font-family: 'MontserratAlternates-Regular';
	color:rgba(0,116,157,1);
}
.single-grid p{
	margin:0.7em 0 1em;
	font-size:1em;
	color:#7c7c7c;
	line-height:1.9em;
}
.single-profile h4 {
	font-size: 2em;
	color:#3A3A3A;
	  margin: 0em;
	font-family: 'MontserratAlternates-Regular';
}
.single-left {
	padding: 2em 0 0;
}
.post-top {
	padding: 0 1em 0 0em;
}
.single-profile {
	padding:0 0 3em 0;
}
.cal ul {
  padding: 0px;
}
.cal ul li{
	display: inline-block;
}
.cal ul li span{
	color:#7C7C7C;
	font-size:1em;
	margin-right: 1em;
	font-family: 'MontserratAlternates-Regular';
}
.cal ul li a{
	color:#7C7C7C;
	text-decoration:none;
	font-size:1em;
	font-family: 'MontserratAlternates-Regular';
}
.post-top h6 {
  font-size: 1.5em;
  color: #000;
  padding: 0.3em 0em 0.1em 0em;
  margin: 0em;
  font-family: 'MontserratAlternates-Regular';
}
.post-top h6 a {
  color: #000;
  text-decoration:none;
}
.post-top h6 a:hover{
	text-decoration:none;
	color: #f8565d;
}
.post-top p{
	font-size: 1em;
	color: #7c7c7c;
	line-height:1.7em;
}
.categories-grid h4{
	color:#3A3A3A;
	font-size: 1.7em;
	padding: 0em 0 0.5em;
	  margin: 0em;
  font-family: 'MontserratAlternates-Regular';
}
.grid-categories {
  padding: 0 0 1em;
}
ul.popular li {
	 list-style: none;
}
ul.popular li a{
	color: #7c7c7c;
  font-size: 1em;
  padding: 0.5em 0;
  display: block;
  text-decoration: none;
}
ul.popular li i {
  margin: 0 8px 0px;
}
ul.popular li a:hover{
	  color:#fc5c5c;
  padding: 0.5em 0 0.5em 0.3em;
}
.single-bottom h3 {
  font-size: 2em;
  color:#f8565d;
    margin: 0em;
 font-family: 'MontserratAlternates-Regular';
}
.single-bottom input[type="text"], .single-bottom textarea {
 font-size: 1.1em;
  width: 98%;
  padding: 0.5em 1em;
  margin: 0.5em 0;
  background: #fff;
  outline: none;
  border: 1px solid #bbb;
  color: #bbb;
}
.single-bottom  input[type="submit"]{
	  border: none;
  color: #000;
  font-size: 1em;
  width: 10%;
  margin: 0.5em 0em;
  background:none;
  border: 3px double #f8565d;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
   padding: 0.3em 1em;
   outline:none;
}
.single-bottom  input[type="submit"]:hover{
	 border: 3px double #3A3A3A;
	
}
.comment {
  padding: 0;
}
 .single-bottom textarea {
	resize:none;
	min-height:180px;
	 margin:0.5em 0em;
	width: 99%;
 }
 .single-bottom form{
	padding:2em 0 0;
 }
 .single {
  padding: 4em 0;
}
.grid-categories ul.popular {
  padding: 0px;
}
i.glyphicon.glyphicon-calendar {
  margin: 0em 0.4em 0em 0em;
}
i.glyphicon.glyphicon-comment {
  margin: 0em 0.4em 0em 0em;
}
/*--//single--*/
/*--about start here--*/
.about-link{
  font-size: 0.9em;
  color: #FFF;
  padding: 0.4em 0em 0.4em 0em;
  display: inline-block;
  min-width:80px;
  width: 30%;
  background: rgba(0,150,250,1);
  border: 3px  rgba(0,116,157,1);
  border-radius: 25px;
  text-align: center;
  margin: 1em 0em 0em 0em;
}

.about-link a:hover {
  text-decoration:none;
  background:rgba(0,116,157,1);
}
.about {
  padding: 1em 0em 5em 0em;
}
.about-top {
  text-align: center;
}
.about-top h3 {
  font-size: 2.5em;
  color: #16214d;
  margin: 0em 0em 0.2em 0em;
  font-family: 'MontserratAlternates-Regular';
}
.about-top p {
  font-size: 1em;
  color: #5A5A5A;
  width: 60%;
  margin: 0 auto;
  line-height: 1.8em;
}
.about-left h4 {
  font-size: 3em;
  color: rgba(0,116,157,1);
  margin: 0em 0em 0.2em 0em;
  font-family: 'MontserratAlternates-Regular';
}
.about-left h5 {
  font-size: 1.2em;
  color: #000;
   margin: 0em 0em 1em 0em;
}
.about-left p {
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  font-size: 1em;
  color:rgba(0,150,250,1);
  line-height: 1.8em;
}
.about-right p {
  color:#FFF;
  line-height: 1.8em;
  font-size: 1em;
  margin: 1em 0em 0em 0em;
}
span.ab-gd-img {
  float: left;
  width: 15%;
}
.ab-gd-text {
  float: right;
  width: 85%;
}
.ab-gd-text h6 {
  font-size: 1.1em;
  color:#2A2828;
  margin-bottom: 0.4em;
  font-family: 'MontserratAlternates-Regular';
}
.ab-sub-gd {
  margin: 0em 0em 1.2em 0em;
}
span.glyphicon.glyphicon-star-empty.ab-gd-img {
  font-size: 3em;
  color: #c9c9c9;
}
span.glyphicon.glyphicon-cloud.ab-gd-img {
  font-size: 3em;
  color: #c9c9c9;
}
span.glyphicon.glyphicon-leaf.ab-gd-img {
  font-size: 3em;
  color:#c9c9c9;
}
.about-grid {
  margin: 1.8em 0em 0em 0em;
}

/*--about end here--*/
/*--ab-info start here--*/
span.ab-info-clr {
  display: block;
}
.ab-info-left h3 {
  font-size: 1.7em;
  color:#80bcf8;
  line-height: 1.5em;
    font-family:'Microsoft YaHei';
}
.ab-info-left p {
  font-size: 1em;
  margin: 1em 0em 0em 0em;
  color: white;
  line-height: 1.6em;
  font-family:'raleway';
}
.ab-info-right p {
  font-size: 1em;
  color: white;
  line-height: 1.8em;
      font-family:'Microsoft YaHei';
}
.ab-info-right a {
        font-family:'Microsoft YaHei';
  font-size: 0.9em;
  color: #FFF;
  padding: 0.4em 0em 0.4em 0em;
  display: inline-block;
  width: 20%;
  background: rgba(0,150,250,1);
  border: 3px  rgba(0,116,157,1);
  border-radius: 25px;
  text-align: center;
  margin: 1em 0em 0em 0em;
}
.ab-info-right a:hover {
  text-decoration:none;
  background:rgba(0,116,157,1);
}
span.ab-line {
  background: #999;
  width: 2px;
  height: 100px;
  display: block;
  position: absolute;
  top: 0%;
  left: 85%;
}
.ab-info-bott {
  position: relative;
}
.ab-info {
  padding: 4em 0em 4em 0em;
  background: url(../icons/home/examiner-banner.jpg)no-repeat center;
    background-size: cover;
}
/*--ab-info end here--*/
/*--courses start here--*/
.courses-footer english{
    font-family:raleway,sans-serif;
}
bold{
    font-weight:bold;
}
.courses-footer{
  background: url(../images/front-page/courses-2.jpg) no-repeat center;
  background-size: cover;
  min-height:330px;
  margin-top:40px;
  vertical-align: middle; 
  color:white;
  font-size:35px;
  padding-left:10vw;
  font-weight:;
  font-family:"Microsoft YaHei";
}
.courses-main h3{
    position:relative;
    width:120px;
    top:-35px;
    background-color:white;
}
.front-courses-icon{
    margin-bottom:40px;
}
.ser-top {
  text-align: center;
  padding: 0em 0em 6em 0em;
}
.courses {
    padding: 8em 0em 8em 0em;
    background: url('../images/moocys/students_in_lecture_hall2.jpg') no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}
.ser-top h3 {
  font-size: 3em;
  color:rgba(0,116,157,1);
  margin-bottom: 0.2em;
  font-family: 'MontserratAlternates-Regular';
}
.ser-top p {
  font-size: 1.5em;
  color:rgba(0,116,157,1);
  /*width: 50%;*/
  margin: 0 auto;
  line-height: 1.8em;
  font-family:raleway;

}
span.glyphicon.glyphicon-plane{
  font-size: 2.5em;
  color: #4A4949;
}
span.glyphicon.glyphicon-glass{
  font-size: 2.5em;
  color: #4A4949;
}
span.glyphicon.glyphicon-cutlery{
  font-size: 2.5em;
  color: #4A4949;
}
.ser-icon {
  float: left;
  width: 15%;
  text-align: center;
}
.ser-text {
  float: right;
  width: 85%;
}
.ser-grid {
  padding: 2em 0em;
}
.courses-right {
  padding: 0px;
  border-top: 2px solid #B8B8B8;
}
.service-left {
  padding: 0px;
}
.ser-grid {
  padding: 2.17em 0em;
  border-bottom: 2px solid #B8B8B8;
}
.ser-text h4 {
  font-size: 1.4em;
  color: #000;
 font-family: 'MontserratAlternates-Regular';
}
.ser-text p {
  font-size: 1em;
  color: #b4b4b4;
  line-height: 1.8em;
}
.img-center {
	margin: 0 auto;
}
/*--courses end here--*/
/*--admission start here--*/
.admission-grid h4 {
  font-size: 1.2em;
  color: #000;
  margin: 1em 0em 0.3em 0em;
}
.admissions {
    color:white;
    background:#222;
  padding: 5em 0em 5em 0em;
}
.admission-top {
  text-align: center;
  padding: 0em 0em 1.5em 0em;
}
.admission-top h3 {
  font-size: 3em;
    font-family:'Microsoft YaHei';
    font-weight:;
  margin-bottom: 0em;
}
.admission-top p2 {
  font-size: 18px;;
    font-family:'Microsoft YaHei';
    font-weight:normal;
  line-height: 1.8em;
}
.admission-top p {
  font-size: 30px;
    font-family:'raleway';
    font-weight:normal;
  line-height: 1.8em;
}
.admission-grid {
    padding-left:25px;
    padding-right:25px;
  text-align: center;
  margin:40px 0px 0px 0px;
}
.admission-grid h3 {
     font-family:'Microsoft YaHei';
  font-size: 1.8em;
}
.admission-grid h4 {
    font-weight:bold;
    color:white;
     font-family:'raleway';
  font-size: 5em;
  line-height: 1.5em;
  margin: 0.3em 0em 0.3em 0em;
}
 .admission-grid p {
  font-family:'Microsoft YaHei';
  font-size: 1em;
  line-height: 1.5em;
  margin: 0em 0em 0.4em 0em;
  padding:20px;
  height:170px;
  border:1px solid rgba(0,116,157,0.2);
  border-radius:25px;
}
 
/*--admission end here--*/
/*--testimonal start here--*/
.testimo {
  background: url(../icons/home/syd-banner.jpg)no-repeat center;
  background-size: cover;
  min-height: 330px;
}
.testimo-main {
  text-align: center;
  padding: 6em 0em 0em 0em;
}
.testimo-main h3 {
  font-size: 2.3em;
  color: #fff;
  margin-bottom: 0.2em;
     font-family:'Microsoft YaHei';
}
.testimo-main p {
  font-size: 1em;
  color: #fff;
  line-height: 1.8em;
       font-family:'Microsoft YaHei';
}
.testimo-main a {
         font-family:'Microsoft YaHei';
  border-radius:25px;
  font-size: 1em;
  color: #fff;
  padding: 0.5em 1em;
  display: inline-block;
  border: 3px double #fff;
  margin: 1.4em 0em 0em 0em;
}
.testimo-main a:hover{
         font-family:'Microsoft YaHei';
  border: 3px double #f8565d;
  text-decoration:none;
}
/*--testimonal end here--*/
/*--testmo-grid start here--*/
.test-grid-img {
  padding: 4em 0em 0em 0em;
}
 /*--testimo grid end here--*/
/*--gallery start here--*/
.gallery {
  padding: 4em 0em 3em 0em;
  background-color:#044772;
}
.gallery-grid {
  margin: 0em 0em 0em 0em;
  padding: 0 0 0 0;
}
.gallery-top {
  padding: 0em 0em 3em 0em;
  text-align: center;
}
.gallery-top h3 {
  font-size: 3em;
  font-weight: 400;
  color:white;
  margin: 0px 0px 15px 0px;
  font-family: 'raleway';
}
.gallery-top p {
  font-size: 0.95em;
  font-weight: 400;
  color:#b4b4b4;
  line-height: 1.8em;
  margin: 0 auto 0em;
  width: 60%;
}
/*--light-box--*/
.project-eff:hover span.rollover1 {
    width: 100%;
    height: 100%;
	background:url(../images/box.png) center no-repeat rgba(248, 86, 93, 0);
	cursor: pointer;
	display: block;
	position: absolute;
	z-index: -9999px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.project-eff{
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	position:relative;
}
/*--//gallery end here--*/
/*--map start here--*/
.map {
  
}
.smaller-point{
    padding-left:15px;
    text-align:left;
    margin-bottom:20px;
}

.map  {
  width: 100%;
  height: 200px;
  border: none;
}
/*--map end here--*/
/*--contact start here--*/

/*--contact end here--*/
/*--footer  start here--*/
.footer {
  background:rgba(0,116,157,1);
  padding: 2em 0em;
}
.ftr-grd h3 {
  font-size: 2em;
  color: #fff;
  margin-bottom: 0.5em;
  font-family: 'MontserratAlternates-Regular';
}
ul.ftr-icons {
  padding: 0em;
  list-style: none;
  margin: 1em 0em 0em 1em;
}
ul.ftr-icons li{
	display:inline-block;
}
.ftr-grd p {
  font-size: 1em;
  color: #fff;
  line-height: 1.7em;
}
ul.ftr-links {
  list-style: none;
  padding: 0px;
}
ul.ftr-links li {
  margin: 0em 0em 0.8em 0em;
}
ul.ftr-links li a{
	color:#fff;
	font-size: 1em;
}
ul.ftr-links li a:hover{
	color:#3A3A3A;
  text-decoration:none;
}
ul.ftr-categ {
  padding: 0em;
  list-style: none;
}
ul.ftr-categ li{
  margin:0em 0em 0.8em 0em;
}
ul.ftr-categ li a {
  font-size: 1em;
  color:#fff;
  margin: 0em 0em 0em 0em;
}
ul.ftr-categ li a:hover{
  color:#3A3A3A;
  text-decoration:none;
}
.ftr-gd4-1 {
  padding: 0px 6px 6px 0px;
}
#toTop {
	display: none;
	text-decoration: none;
	position: fixed;
	bottom: 10px;
	right: 0px;
	overflow: hidden;
	width: 48px;
	height: 48px;
	border: none;
	text-indent: 100%;
	background: url(../images/top_mover.png) no-repeat 0px 0px;
}
/*--footer end here--*/
/*--copyright start --*/
.copyright {
  padding: 1em 0em;
  font-size:11px;
  background:#044772;
}
.copy-main {
  text-align: center;
}
.copy-main p {
  font-size: 1em;
  color: #fff;
}
.copy-main p a{
	color:#f8565d;
}
.copy-main p a:hover{
	text-decoration:none;
	color:#fff;
}
/*--copy right send here--*/

.ser-grid {
  padding: 1.74em 0em;
}
}
@media(max-width:1366px){
.ser-grid {
  padding: 1.6em 0em;
}	
}
@media(max-width:1280px){
.ser-grid {
  padding: 1.35em 0em;
}
.banner {
  min-height: 515px;	
}
}
@media(max-width:1024px){
.header-right {
  width: 26%;
}
.top-nav {
  width: 74%;
}
.banner {
  min-height: 500px;
}
.ab-sub-gd {
  margin: 0em 0em 0.9em 0em;
}
.about-grid {
  margin: 1em 0em 0em 0em;
}
.about-left h5 {
  margin: 0em 0em 0.5em 0em;
}
.about {
  padding: 4em 0em 4em 0em;
}
span.ab-line {
  left: 92%;
}
.courses {
  padding: 3em 0em 3em 0em;
}
.about-left h4 {
  font-size: 2.5em;
}
.ser-top h3 {
  font-size: 2.5em;
}
.ser-top p {
  width: 70%;
}
span.glyphicon.glyphicon-plane {
  font-size: 2em;
}
span.glyphicon.glyphicon-glass {
  font-size: 2em;
}
span.glyphicon.glyphicon-cutlery {
  font-size: 2em;
}
.ser-text h4 {
  font-size: 1em;
}
.ser-grid {
  padding: 0.98em 0em;
}
.ser-top {
  padding: 0em 0em 2.5em 0em;
}
.admission-top h3 {
  font-size: 2em;
}
.admission-grid h4 {
  font-size: 1em;
}
.admission-grid h4 {
  margin: 0em 0em 0em 0em;
}
.admission-grid p {
  font-size: 0.9em;
}
.admission-grid h3 {
  font-size: 1.3em;
}
.admissions {
  padding: 0em 0em 4em 0em;
}
.testimo-main h3 {
  font-size: 2em;
}
.gallery-top h3 {
  font-size: 2.5em;
}
.project-eff:hover span.rollover1 {
  height: 204px;
  width: 283px
}
.gallery {
  padding: 3em 0em 2em 0em;
}
.contact {
  padding: 3em 0em 3em 0em;
}
.contact-top h3 {
  font-size: 2.5em;
}
.ftr-grd h3 {
  font-size: 1.7em;
}
/*--single--*/
.single-bottom input[type="submit"] {
  font-size: 1em;
  width: 14%;
}
.post-top p {
  font-size: 0.81em;
}
.single-grid p {
  font-size: 0.85em;
}
ul.popular li a {
  font-size: 0.8em;
}	
}
@media(min-width:768px) {
.res2{
    display:none;
}
}
.res2{
    color:#004669;
}
@media(max-width:768px){
span.menu{
		display: block;
		text-align: right;
		padding: 0px 0px 0px 0px;
		cursor: pointer;
		color: #E74C3C;
		font-size: 16px;
		font-weight: 700;
		position:relative;
}
.course-detail-title {
    font-size:36px;
}
.top-nav ul.res {
	 display:none;
		margin: 5em 0 0 0;
		z-index: 9999;
		position: fixed;
		top:0;
		width: 100%;
		left:0;
		height:100vh;
		background-color:rgba(255,255,255,0.7);
}

.top-nav ul.res li{
		display: block;
		text-align: center;
		background:gray;
		margin: 0;
		width: 100%;
		padding: 0em;
}

.top-nav ul.res li a {
		font-size: 14px;
		padding: 0.6em 0;
		color: #fff;
		display: block;
		border: none;
		text-align: center;
		margin: 0em;
}
ul.res li a:hover,ul.res li a.active{
	color:#000;
}
.header-right {
  width: 33%;
}
.top-nav {
  width: 50%;
}
.banner {
  min-height:350px;
}
.banner-main {
  padding: 8em 0em 0em 0em;
}
.logo h1 {
  font-size: 2.5em;
}

.about {
  padding: 9em 0em 3em 0em;
}
.about-left p {
  font-size: 0.95em;
}
.about-right {
  margin: 2.5em 0em 0em 0em;
}
.about-right img {
  width: 100%;
}
.ab-info-left {
  background:rbga(255,255,255,0.5);
  float: left;
  width: 50%;
}
.ab-info-right {
  float: right;
  width: 50%;
}
.ab-info-right a {
  width: 40%;
}
.ab-info {
  padding: 3em 0em 3em 0em;
}
.admission-grid {
  float: left;
  width: 100%;
  margin: 1em 0em 1em 0em;
}
.admissions {
  padding: 4em 0em 4em 0em;
}
.testimo {
  min-height: 300px;
}
.testimo-main {
  padding: 4.5em 0em 0em 0em;
}
.test-grid-img {
  padding: 3em 0em 0em 0em;
}
.test-grid {
  float: left;
  width: 33.3%;
  padding: 0px 10px 0px 0px;
}
.ab-info-right p {
  font-size: 0.9em;
}
.gallery-top p {
  width: 80%;
}
.gallery-grid {
  float: left;
  width: 33.3%;
  padding: 0px 10px 0px 0px;
  margin: 0em 0em 0.5em 0em;
}
.project-eff:hover span.rollover1 {
  height: 166px;
  width: 230px;
}
.contact-top p {
  width: 85%;
}
.ftr-grd {
  float: left;
  width: 50%;
}
.ftr-gd4-1 {
  float: left;
  width: 33%;
}
.ftr-gd4-1 img {
  width: 100%;
}
.contact-left input[type="text"] {
  font-size: 0.9em;
  padding: 8px 10px 8px 10px;
  margin: 0em 0em 1em 0em;
}
/*--single--*/
.post-top {
  float: left;
  width: 25%;
}
.single-bottom input[type="text"], .single-bottom textarea {
  width: 100%;
}
.categories-grid {
  margin-top: 1em;
}
.single-grid h4 {
  font-size: 1.5em;
}
.single-grid {
  margin: 0em 0 2em;
}
.post-top h6 {
  font-size: 1.2em;
}
.single-profile {
  padding: 0 0 2em 0;
}
.single-bottom form {
  padding: 1em 0 0;
}
.single {
  padding: 2em 0;
}
.single-bottom input[type="text"], .single-bottom textarea {
  font-size: 0.9em;
}
}
@media(max-width:736px){
.header-right {
  width: 35%;
}	

}
@media(max-width:667px){
.header-right {
  width: 38%;
}	
}
@media(max-width:640px){
.header-right {
  width: 40%;
}	
span.ab-line {
  left: 95%;
}
.testimo-main h3 {
  font-size: 1.6em;
}
.project-eff:hover span.rollover1 {
  height: 135px;
  width: 187px;
}
.map iframe {
  height: 220px;
}
.ser-top p {
  width: 95%;
}
.header {
  padding: 1.5em 0em 1.5em 0em;
}
.banner-main h2 {
  font-size: 2.5em;
}
/*--single--*/
.single-grid h4 {
  font-size: 1.5em;
}
.post-top h6 {
  font-size: 1.2em;
}
.single {
  padding: 3em 0 2em;
}	
}
@media(max-width:600px){
.header-right {
  width: 43%;
}	

}
@media(max-width:568px){
.header-right {
  width: 46%;
}	
}
@media(max-width:480px){
.top-nav {
}	
.header-right {
  width: 55%;
}
.banner-main h2 {
  font-size: 1.8em;
}
.banner {
  min-height: 275px;
}
.banner-main {
  padding: 5em 0em 0em 0em;
}
.banner {
  min-height: 240px;
}
.header {
  padding: 1em 0em 1em 0em;
}
.logo h1 {
  font-size: 2.3em;
}
.about {
  padding: 9em 0em 1.5em 0em;
}
.courses-sub-panel{
    font-size:12px;
    height:auto;
}

.about-left h4 {
  font-size: 2em;

}
.about-left h5 {
  font-size: 1.1em;
}
.about-left p {
  font-size: 0.9em;
}
span.glyphicon.glyphicon-star-empty.ab-gd-img {
  font-size: 2.6em;
}
span.glyphicon.glyphicon-cloud.ab-gd-img {
  font-size: 2.6em;
}
span.glyphicon.glyphicon-leaf.ab-gd-img {
  font-size: 2.6em;
}
.ab-gd-text h6 {
  font-size: 1em;
  margin-bottom: 0.2em;
}
.about-right {
  margin: 1.5em 0em 0em 0em;
}
.about-right p {
  font-size: 0.9em;
}
.ab-info-left h3 {
  font-size: 1.3em;
}
.ab-info-left p {
  font-size: 0.95em;
  margin: 0.5em 0em 0em 0em;
}
.ab-info-right p {
  font-size: 0.8em;
}
.ab-info-right a {
  font-size: 0.83em;
  padding: 0.3em 0em 0.3em 0em;
  width: 50%;
  margin: 0.8em 0em 0em 0em;
}
.ab-info {
  padding: 2em 0em 2em 0em;
}
span.ab-line {
  height: 140px;
}
.ser-top h3 {
  font-size: 2em;
}
.courses {
  padding: 1.5em 0em 1.5em 0em;
}
.ser-top p {
  width: 100%;
  font-size: 0.9em;
}
.admission-top h3 {
  font-size: 1.5em;
}
.admission-grid h4 {
  font-size: 70px;
}
.admission-top {
  padding: 0em 0em 1.5em 0em;
}
.admission-top p {
}
.admissions {
  padding: 4em 0em 4em 0em;
}
.testimo-main h3 {
  font-size: 1.2em;
}
.testimo-main p {
  font-size: 0.8em;
}
.testimo-main a {
  font-size: 0.9em;
  padding: 0.3em 1em;
  margin: 1em 0em 0em 0em;
}
.testimo-main {
  padding: 3.5em 0em 0em 0em;
}
.testimo {
  min-height: 225px;
}
.test-grid-img {
  padding: 2em 0em 0em 0em;
}
.gallery {
  padding: 1.5em 0em 2em 0em;
}
.gallery-top h3 {
  font-size: 2em;
}
.ftr-grd h3 {
  font-size: 1.5em;
}
.gallery-top p {
  width: 100%;
  font-size: 0.9em;
}
.contact-top p {
  width: 100%;
  font-size: 0.9em;
}
.ser-text p {
  font-size: 0.9em;
}
.gallery-grid {
  width: 50%;
}
.project-eff:hover span.rollover1 {
  height: 149px;
  width: 206px;
}
.contact {
  padding: 1.5em 0em 2em 0em;
}
.contact-top h3 {
  font-size: 2em;
}
.ftr-grd {
  float: none;
  width: 100%;
  margin: 0em 0em 0em 0em;
  padding:0px;
}
span.menu img {
}
/*--single--*/
.lone-line {
  padding: 0.5em 0em 0em 0em;
}
.single-grid h4 {
  font-size: 1.2em;
}
.single-grid h4 {
  font-size: 1.2em;
}
.single-grid {
  margin: 0em 0 1.5em;
}
.single-profile {
  padding: 0 0 1.5em 0;
}
.single-profile h4,.single-bottom h3 {
  font-size: 1.5em;
}
.post-top {
  width: 50%;
  padding: 0 10px;
}
.single-bottom form {
  padding: 1em 0 0;
}
.single-bottom input[type="submit"] {
  width: 17%;
}	
}
@media(max-width:414px){
.header-right {
  width: 65%;
}	
}
.about-banner-height{
    height:450px;
}
@media(max-width:384px){
.header-right {
  width: 70%;
}	

}
@media(max-width:320px){
.header-right {
  width: 61%;
}
.logo h1 {
  font-size: 1.8em;
}
.right button {
  width: 15px;
  height: 19px;
  background-size: 106%;
}
.social-icons ul li a span {
  width: 18px;
  height: 17px;
  background-size: 555%;
}
.social-icons ul li a span.tw {
  background-position: -13px 0px;
}
.social-icons ul li a span.g {
  background-position: -30px 0px;
}
.social-icons ul li a span.in {
  background-position: -48px 0px;
}
.social-icons ul li a span.pin {
  background-position: -66px 0px;
}
.social-icons ul li a span.you {
  background-position: -84px 0px;
}
.social-icons ul li a span.fa:hover {
  background-position: 7px -17px;
}
.social-icons ul li a span.tw:hover {
  background-position: -13px -17px;
}
.social-icons ul li a span.g:hover {
  background-position: -30px -17px;
}
.social-icons ul li a span.in:hover {
  background-position: -48px -17px;
}
.social-icons ul li a span.pin:hover {
  background-position: -66px -17px;
}
.social-icons ul li a span.you:hover {
  background-position: -84px -17px;
}
span.menu img {
}
.social-icons ul li {
  margin: 0em 0.1em 0em 0em;
}
.navg-strip {
  /*padding: 0.5em 0em 0.5em 0em;*/
}
.banner-main h2 {
  font-size: 1.2em;
}
.banner-main {
  padding: 3.5em 0em 0em 0em;
}
.banner {
  min-height: 180px;
}
.about-left {
  padding: 0em;
}
.about-left h5 {
  font-size: 1em;
}
.about-left h4 {
  font-size: 1.7em;
}
span.glyphicon.glyphicon-star-empty.ab-gd-img {
  font-size: 2.1em;
}
span.glyphicon.glyphicon-cloud.ab-gd-img {
  font-size: 2.1em;
}
span.glyphicon.glyphicon-leaf.ab-gd-img {
  font-size: 2.1em;
}
.about-right {
  padding: 0em;
}
.ab-info-left {
  float: none;
  width: 100%;
  padding: 0em;
}
span.ab-line {
  width: 50px;
  height: 2px;
    top: 106%;
  left: 35%;
}
.ab-info-right {
  float: none;
  width: 100%;
  padding: 1.2em 0em 0em 0em;
}
.ab-info {
  padding: 1em 0em 1.5em 0em;
}
.ser-top h3 {
  font-size: 1.7em;
}
.ser-top {
  padding: 0em 0em 1.5em 0em;
}
.ser-text h4 {
  font-size: 0.92em;
}
.admission-grid {
  float: none;
  width: 100%;
  margin: 0em 0em 1em 0em;
  padding: 0em;
}
.testimo-main {
  padding: 1.5em 0em 0em 0em;
}
.testimo-main h3 {
  font-size: 1.2em;
}
.testimo {
  min-height: 195px;
}
.test-grid {
  float: none;
  width: 100%;
  padding: 0px 0px 6px 0px;
}
.test-grid-img {
  padding: 1.5em 0em 0em 0em;
}
.gallery-top h3 {
  font-size: 1.8em;
}
.gallery {
  padding: 1em 0em 1em 0em;
}
.gallery-top {
  padding: 0em 0em 1em 0em;
}
.project-eff:hover span.rollover1 {
  height: 92px;
  width: 126px;
}
.project-eff:hover span.rollover1 {
  background-size: 15%;
}
.map iframe {
  height: 150px;
}
.contact-left {
  padding: 0px;
}
.contact-right {
  padding: 0px;
}
.ftr-grd h3 {
  margin-bottom: 0.2em;
}
.contact-top h3 {
  font-size: 1.8em;
}
.contact-top {
  padding: 0em 0em 1.5em 0em;
}
.contact-right textarea {
  height: 100px;
}
.ftr-grd h3 {
  font-size: 1.2em;
}
.ftr-grd p {
  font-size: 0.9em;
}
ul.ftr-links li {
  margin: 0em 0em 0.5em 0em;
}
ul.ftr-links li a {
  font-size: 0.9em;
}
ul.ftr-categ li a {
  font-size: 0.9em;
}
ul.ftr-categ li {
  margin: 0em 0em 0.5em 0em;
}
.footer {
  padding: 1.2em 0em; 
} 


/*--single--*/
.single {
  padding: 1.5em 0 0.5em;
}
.col-md-8,.categories-grid {
  padding: 0;
}
.single-grid h4 {
  font-size: 1em;
}
.single-grid p {
  margin: 0.3em 0 0em;
  font-size: 0.8em;
}
.single-profile h4, .single-bottom h3 {
  font-size: 1.3em;
}
.single-left {
  padding: 1em 0 0;
}
.post-top {
  width: 50%;
  padding: 0 5px;
    margin: 0em 0em 1em 0em;
}
.post-top p {
  font-size: 0.8em;
  line-height: 1.5em;
}
.post-top h6 {
  font-size: 1em;
}
.single-bottom textarea {
  min-height: 140px;
}
.single-bottom input[type="submit"] {
  width: 24%;
}	
button.btn.btn-1 {
  font-size: 0.79em;
}
span.label {
  margin: 0 0 0.5em;
  display: inline-block;
  font-size: 0.8em;
}	
button.btn.btn-lg {
  font-size: 0.8em;
  padding: 0px;
}
.single-profile {
  padding: 0 0 0.5em 0;
}
.single-bottom form {
  padding: 0.4em 0 0;
}
.categories-grid h4 {
  font-size: 1.5em;
}
.single-bottom input[type="submit"] {
  padding: 0.3em 1em;
}
.search {
  width: 222px;
}
.search input[type=submit] {
  padding: 6px 10px;
  font-size: 0.7em;
   top: 6px;
}
.search input[type=text] {
  padding: 1px;
}
.search {
  padding: 0.4em;
  top: 58px;
}
.close-in {
  top: -22px;
  padding: 0px;
}
}


.contact-banner{
  background: url(../images/contact/contact-us-banner.jpg) no-repeat center;
  background-size: cover;
  height:330px;
  vertical-align: middle; 
  color: rgba(0,116,157,1);
  font-size:35px;
  font-weight:bold;
  padding-left:20vw;
  font-family:Gotham SSm A,Gotham SSm B,sans-serif
}

#contact-box{
    min-height:300px;
    height:auto;
    width:auto;
    margin-top:50px;
    margin-bottom:50px;
}

#banner-text{
    top:50%;
    position:relative;
}

#inner-contact-box h2{
     font-size:30px;
     font-weight:bold;
}
#inner-contact-box b{
     color:rgba(0,116,157,1);
     font-weight:bold;
}

#inner-contact-box{
     background: #EFF5FB;
     width:60%;
     height:300px;
     margin:10px;
     box-sizing: border-box;
     color:rgba(0,116,157,1);
     padding:50px;
     text-align:left;
}

@media(max-width:700px) {
    #inner-contact-box{
     background: #EFF5FB;
     width:75%;
     min-width:350px;
     height:300px;
     margin:10px;
     box-sizing: border-box;
     color:rgba(0,116,157,1);
    }
}
.contact-banner-title {
    line-height: 1;
    display: -webkit-inline-box;
}

.contact-banner2{
  background: url(../images/contact/sydney.jpg) no-repeat center;
  background-size: cover;
  height:330px;
  vertical-align: middle; 
  color: rgba(0,116,157,1);
  font-size:35px;
  font-weight:bold;
  padding-left:20vw;
  font-family:Gotham SSm A,Gotham SSm B,sans-serif
}

.banner-subscription {
  background: url(../images/subscription/front.jpg)no-repeat center;
  min-height:90vh;
  height: 350px;
  background-size: cover;
  margin-top:120px;
}

.banner-subscription-main {
  padding: 3em 0em 0em 0em;
  text-align: center;
}
.banner-subscription-main h3 {
  padding-top:10px;
  text-shadow: 2px 4px 3px rgba(0,0,0,0.7);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 1.5em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}
.banner-subscription-main h2 {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 2em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}

.courses-sub-panel{
       margin:50px 15px 25px 15px;
        padding:20px;
            /*border: 1px solid rgba(0,116,157,0.2);*/
            border-radius:25px;
  }

@media (min-width: 768px) {
    .banner-about-main h2 {
        padding-top: 150px;
    }
    .courses-sub-panel{
    height:350px;
    }

}
.container {
    min-height: 40px;
}
@media (min-width: 1600px) {
    .container {
    min-height: 40px;
    width: 1470px;
    }
}

@media (min-width: 990px) {
    .banner-subscription {
        height: 980px;
    }
}

@media (max-width: 990px) {
    .banner-subscription {
        height: 2150px;
    }
}




@media (max-width: 760px) {
    .banner-subscription {
        height: 2180px;
    }
}


@media (max-width: 420px) {
    .banner-subscription {
        height: 2280px;
    }
}

@media (max-width: 280px) {
    .banner-subscription {
        height: 2340px;
    }
}

.subscription-intro-pallet{
    background:rgba(255,255,255,1);
    padding:20px;
    border-top:solid #00749D 15px;
    min-width:300px;
    border-radius:30px;
}


@media (min-width: 990px) {
    .subscription-intro-pallet {
        height: 680px;
    }
}

.subscription-grid {
    padding-left:25px;
    padding-right:25px;
  text-align: left;
  margin:40px 0px 0px 0px;
  border-radius:25px;
}

.radius {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}

.compare-grid {
    padding-left:25px;
    padding-right:25px;
  text-align: left;
  margin:40px 0px 0px 0px;
  min-width:890px
}

.subscription-grid-icon{
    
}

.subscription-intro-pallet td{
    padding:5px 15px 5px 15px;
    font-size:14px;
    color:#044772;
    font-family:'Microsoft YaHei';
    font-weight:bold;
    border-bottom:dotted 0px white;
}

.subscription-intro-pallet p{
    font-size:14px;
    color:#044772;
    font-family:'Microsoft YaHei';
    font-weight:bold;
    border-bottom:dotted 0px white;
}

subscription-description{
    height:80px;
}

sub-price{
    font-size:16px;
    color:#044772;
    font-family:'Microsoft YaHei';
    font-weight:bold;
}

price{
    font-size:22px;
    color:#D55C62;
    font-family:'Microsoft YaHei';
    font-weight:bold;
}


.price-button{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  font-family: Arial;
  font-size:15px;
  color: #ffffff;
  font-size: 13px;
  background: #044772;
  padding: 8px 20px 8px 20px;
  text-decoration: none;
  border: 0;
  border-radius: 10px;
}

.price-button:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -moz-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -ms-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -o-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: linear-gradient(to bottom, #3cb0fd, #1d80c2);
  text-decoration: none;
   font-size: 13px;
  border: 0;
}

.course-button{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  font-family: 'Microsoft YaHei';
  color: #ffffff;
  font-size: 20px;
  background:rgba(0,116,157,1);
  padding: 12px 45px 12px 45px;
  text-decoration: none;
  border: 0;
  margin-bottom:50px;
  border:1px solid rgba(0,116,157,1);
}

.course-button:hover {
  background: white;
  color:rgba(0,116,157,1);
  text-decoration: none;
  font-family: 'Microsoft YaHei';
  font-size:20px;
  border: 0;
    padding: 12px 45px 12px 45px;
  border:1px solid rgba(0,116,157,1);
}

.compare-button{
    font-family:'Microsoft YaHei';
margin-top:50px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  color: #D55C62;
  font-size: 20px;
  background: rgba(255,255,255,0.8);
  padding: 8px 20px 8px 20px;
  text-decoration: none;
  border-bottom:solid 0px  #044772;
  border-left:solid 0px  #044772;
  border-right:solid 0px  #044772;
  border-top:solid 0px  #044772;
}

.compare-button:hover {
    font-family:'Microsoft YaHei';
    margin-top:50px;
  background: rgba(255,255,255,1);
  color:black;
  text-decoration: none;
   font-size: 20px;
    border-bottom:solid 00px  #044772;
  border-left:solid 0px  #044772;
  border-right:solid 0px  #044772;
  border-top:solid 0px  #044772;
}

.banner-subscription h4 {
    font-size:40px;
    font-weight:bold;
    color:#00749D;
    font-family:Microsoft YaHei;
    margin-top:10px;
    margin-bottom:10px;
    padding-bottom:10px;
    text-align:center;
   
}

.compare-intro-pallet td{
      font-family:'Microsoft YaHei';
      color:#044772;
    min-height:100px;
    font-size:16px;
    font-weight:normal;
    padding:15px;
    border-bottom:dotted 1px rgba(255,255,255,0.5);
}

.compare-intro-pallet{
    height:auto;
    background:rgba(255,255,255,0.7);
    padding:20px 20px 100px 20px;
    border-top:solid #00749D 15px;
    min-width:300px;
}
.banner-compare {
margin-top:120px;
}
@media (min-width: 990px) {
    .banner-compare {
        height: 1280px;
    }
    .introvideo {
        padding-bottom:30px;
    }
}

@media (max-width: 990px) {
    .banner-compare {
        height: 1680px;
    }
    
}


@media (max-width: 760px) {
    .banner-compare {
        height: 1680px;
    }
}


@media (max-width: 420px) {
    .banner-compare {
        height: 1680px;
    }
}

@media (max-width: 280px) {
    .banner-compare {
        height: 1680px;
    }
}

.banner-compare {
  background: url(../images/subscription/front.png)no-repeat center;
  min-height:30vh;
  height: 350px;
  background-size: cover;
}

.banner-compare-main {
  padding: 6em 0em 0em 0em;
  text-align: center;
}
.banner-compare-main h3 {
  padding-top:10px;
  text-shadow: 2px 4px 3px rgba(0,0,0,0.7);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 1.5em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}
.banner-compare-main h2 {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
  text-shadow: horizontal-offset vertical-offset blur color;
  font-size: 2em;
  color: #fff;
  font-family: 'MontserratAlternates-Regular';
}
.banner-course-video{
  background-color:#004669;
  background-size: cover;
  padding-bottom:20px;
}
.banner-course-explain{
 background: url(../images/subscription/front.png)no-repeat ;
  min-height:60vh;
  height: 350px;
  background-size: cover
}

.course-detail-title{
    padding-top:50px;
    font-family:'raleway';
    color:#FFF;
    min-height:100px;
    font-size:56px;
    font-weight:;
}

.course-detail-sub-title{
     font-family:'Microsoft YaHei';
    font-size:36px;
    padding-bottom:10px;
}

.banner-course-count{
 background: url(../icons/subscription/subscription_count.png)no-repeat center ;
 background-size:cover;
  min-height:30vh;
  height: 350px;
    text-align:center;
    font-family:'raleway';
    font-size:96px;
    color:#004669;
}
.count-details{
    padding-top:50px
}
.count-details-chinese{
    color:#004669;
    font-size:30px;
    font-family:'Microsoft YaHei';
    padding-left:0;
    max-width:500px;
    font-weight:bold;
}

.count-details-english{
    color:#004669;
    font-size:18px;
    font-family:'raleway';
    padding-bottom:10px;
    max-width:500px;
}

.banner-course-details{
  background-color:white;
  min-height:1250px;
  background-size: cover;

    font-size:18px;
    font-family:'raleway';
}

.course-details-title{
    color:#004669;
    font-size:30px;
    font-family:'Microsoft YaHei';
    padding-top:100px;
    padding-bottom:10px;
    max-width:500px;
    font-weight:bold;

}

.course-details-title-english{
    color:#004669;
    font-size:18px;
    font-family:'raleway';
}

.course-details-content{
    color:#004669;
    font-size:16px;
    font-family:'Microsoft YaHei';
    padding-top:20px;
    padding-bottom:10px;
    max-width:500px;
    font-weight:bold;
}



.course-details-content-box table{
    background-color:#b7edff;
    color:#004669;
    font-size:16px;
    font-family:'Microsoft YaHei';
    padding-top:20px;
    padding-bottom:10px;
    font-weight:bold;
}

.course-details-content-box {
    padding:30px 15px 30px 15px;
    max-width:500px;
    position:relative;

}

.course-detail-container{
    max-width:960px;
    padding-top:50px;
    color:#004669;
    font-size:15px;
    font-family:'Microsoft YaHei';

}

@media (max-width: 768px) {
    .banner-course-details{
  background-color:white;
  background-size: cover;

    font-size:18px;
    font-family:'raleway';
}
}

.course-price{
    font-size:20px;
    font-family:'Microsoft YaHei';
    font-weight:bold;
    color:#004669;
    width:150px;
    margin-top:40px;
    padding-top:3px;
    padding-bottom:3px;
}

.course-price price{
    font-size:30px;
}

.banner-course-price-div{
    background-color:white;
    height:250px;
}

.course-price-button{
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0px;
  font-size:15px;
  color: #ffffff;
  font-size: 25px;
  background: #044772;
  padding: 12px 24px 12px 24px;
  text-decoration: none;
  border: 0;
}

.course-price-button:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -moz-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -ms-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: -o-linear-gradient(top, #3cb0fd, #1d80c2);
  background-image: linear-gradient(to bottom, #3cb0fd, #1d80c2);
  text-decoration: none;
   font-size: 25px;
  border: 0;
}

.back-div{
  margin-left:20px;
  margin-top:20px;
}

.banner-course-price-div a{
    font-size:20px;
    font-family:'Microsoft YaHei';
    font-weight:bold;
    color:#004669;
}

.banner-course-price-div a:hover{
    text-decoration:none;
    background-color:#004669;
    font-size:20px;
    font-family:'Microsoft YaHei';
    font-weight:bold;
    color:white;
}

.courses-sub-panel h3{
    font-family:'Microsoft YaHei';
    color:rgba(0,116,157,1);
}

.courses-sub-panel h3 english{
    font-family:'raleway';
    color:rgba(0,116,157,1);
    font-weight:normal;
}

.courses-sub-panel p{
    font-family:'Microsoft YaHei';
    font-size:16px;
    color:#004662;
}

.introvideo{
    max-width:700px;
}

.container-fluid h2{
    color:white;
     font-family:'raleway';
}

.container-fluid h3{
    color:white;
   font-family:'Microsoft YaHei';
   font-size:30px;
}
.container-fluid p{
    color:#8fd9f6;
  font-family:'raleway';
   font-size:13px;

}

.about-content-container{
    max-width:750px;
    text-align:center;
       
}

@media (max-width: 768px) {
    .main-logo {
        /*visibility:hidden;*/
    }


}

.gallery-bottom{
    border:0px rgba(255,255,255,0.5) solid;
    padding: 25px;
}


@media (min-width: 760px) {
   
    .introvideo {
        padding-bottom:50px;
    }
}

.footer-class{
    border:solid 0px black;
    line-height:5px;
 }

.footer-class a{
    text-decoration:none;
 }

.footer-class a h2{
     font-family:'Microsoft YaHei';
     font-size:20px;
    color:white;
    font-weight:bold;
 }

.footer-class a h3{
     font-family:'Microsoft YaHei';
     font-size:14px;
    color:#98d7fb;
    font-weight:normal;
 }

.footer-class english a h2{
     font-family:'Microsoft YaHei';
     font-size:20px;
    color:white;
    font-weight:bold;
 }

.footer-class english a h3{
     font-family:'Microsoft YaHei';
     font-size:12px;
     color:#98d7fb;
    font-weight:normal;
 }

@media (max-width: 992px) {
   .footer-class chinese a h2{
       margin-top:30px;
     font-family:'Microsoft YaHei';
     font-size:20px;
    color:white;
    font-weight:bold;
    border-bottom:1px white solid;
 }
   
    .footer-button {
        margin-top:20px;
        margin-right:20px;
    }
    .enroll-now{
      transition:opacity 0.5s ease-in-out;
    padding:6px 8px 6px 8px;
    color:white;
    position:fixed;
    right:1%;
    top:8px;
     z-index:3;
     text-decoration:none;
     visibility:hidden;
}
}

.footer-button {
-webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 8px;
  font-family: 'Microsoft YaHei';
  font-size:13px;
  color: #ffffff;
  background:rgba(0,117,157,1);
  padding: 9px 15px 9px 15px;
  width:200px;
  text-decoration: none;
  border: 0;
  margin-bottom:10px;
  border:1px solid rgba(255,255,255,0.5);
  white-space:nowrap;
  text-align:left;
}

.footer-button:hover {
	background-color:rgba(4,71,114,0.5);
}
.footer-button:active {
	position:relative;
	top:1px;
}

.contact-top {
  text-align: center;
  padding: 0em 0em 3em 0em;
}
.contact-top h3 {
  font-size: 3em;
  color:#044772;
  margin-bottom: 0.2em;
  font-family: 'Microsoft YaHei';
}
.contact-top h2 {
    font-family: 'raleway';
  font-size: 2em;
  color:#044772;
  margin-bottom: 0.2em;
}

.contact-left, .contact-right {
     font-family: 'Microsoft YaHei';
     font-size:13px;
     font-weight:bold;
}

.contact-input{
    background-color:black;
}



.contact {
  padding:5em 0em 5em 0em;
}

.contact-left input[type="text"] {
  display: inline-block;
  background: #f2fbff;
  border: 1px solid #A3A1A1;
  width: 100%;
  outline: none;
  font-size: 0.95em;
  color: #747577;
  font-weight: 400;
  padding: 13px 15px 13px 15px;
  margin: 0.5em 0em 1.5em 0em;
  border-radius:5px;
}
.contact-right textarea {
  background: none;
  border: 1px solid #A3A1A1;
  width: 100%;
  display: block;
  height: 205px;
  outline: none;
  font-size: 0.9em;
    background: #f2fbff;
  color: #747577;
  font-weight: 400;
  resize: ;
  padding: 10px 15px 10px 15px;
  margin-top:20px;
  border-radius:5px;

}
input[type="submit"] {
  border-radius:25px;
  font-size: 1em;
  color: white;
  background: #044772;
  padding: 0.2em 3em 0.2em 3em;
  display: block;
  margin: 0.5em 0em 0em 0em;
  outline: none;
  border-width:0px;
  font-family: 'Microsoft YaHei';
}
input[type="submit"]:hover{
    background:#448cba;
	text-decoration:none;
}

.contact-us-banner{
    background:url(../icons/home/contact-us-banner.jpg)no-repeat center;
    background-size:cover;
    height:250px;
    width:100%
}

.contact-button a:hover {
  text-decoration:none;
  color: rgba(255,255,255,0.7);
}
.contact-button a {
     font-family: 'Microsoft YaHei';
    font-size: 2.3em;
    color: #FFF;
    padding: 0.4em 0em 0.4em 0em;
    display: inline-block;
    width:auto;
    border: 3px rgba(0,116,157,1);
    text-align: center;
    margin: 1em 0em 0em 0em;
}

english{
     font-family: 'raleway';
}


@media(min-width:1468px) {

    .about-row {
        margin: 35px 35px 35px 220px;
    }
}

.subscription-button {
    background:#044772;
     font-family: 'Microsoft YaHei';
     color:white;
     border-radius:25px;
    width:150px;
    height:40px;
    padding:10px;
    white-space:nowrap;
}

.subscription-button:hover {
    background:#3cb0fd;
     font-family: 'Microsoft YaHei';
     color:white;
     border-radius:25px;
    width:150px;
    height:40px;
    padding:10px;
    white-space:nowrap;
}

.subscription-button a{
     font-family: 'Microsoft YaHei';
     color:white;
}

welcome{
    font-size:23px;
    font-family:'raleway';
    margin-top:120px;
}

subscription{
    font-size:20px;
    float:right;
    font-family:'raleway';
}

#registerLink{
    margin-left:10px;
}


@media(min-width:1660px) {

    .about-content-container {
        margin-right:9%;
    }
}

@media(max-width:1080px) {

    .footer-button{
        width:160px;
    }
}

 .res2{
        padding-top:0px;
    }


 .row .home-page-title h2{
     font-family: 'Microsoft YaHei';
     font-weight:normal;
     color:white;
     padding:10px;

 }

  .row .training a{
      color:white;
      text-decoration:none;
  }

  .inner-training{
        background-color:#262626;
      border:1px black solid;
      padding:10px;
      color:white;
  }

 .row .reading{
    border:1px #f8565d solid;
    background: #f8565d;
 }

 .materials-pallet {
     position:relative;
     width:95%;
     height:auto;
     margin:10px;
     text-align:left;
     border-radius:10px;
    padding:10px;
 }

 .row .reading:hover{
     background-color:#f8565d;
     padding:10px;
     border:1px #f8565d solid;
     color:white;
 }


 .row .writing{
         border:1px rgba(0,116,157,1) solid;
    background: rgba(0,116,157,1) ;
 }

  .row .writing:hover{
       background-color:rgba(0,116,157,1);
     padding:10px;
     border:1px rgba(0,116,157,1) solid;
     color:white;
 }

  .row .listening{
       border:1px #6e3c9a solid;
    background: #6e3c9a ;
 }

   .row .listening:hover{
      background-color:#6e3c9a;
     padding:10px;
     border:1px #6e3c9a solid;
     color:white;
 }


   .row .speaking{
         border:1px #2bb54b solid;
    background: #2bb54b;
 }

    .row .speaking:hover{
     background-color:#2bb54b;
     padding:10px;
     border:1px #2bb54b solid;
     color:white;
 }

    .student-home-exam-not-marked{
        font-size:15px;
        padding:10px 30px 0px 30px;
        float:left;
        width:100%;
    }

    .date-created{
        float:right;
        font-size:13px;
     
    }

    .unmarked-exam{
        color:white;
        background-color:rgba(0,116,157,1);
        border:0px rgba(0,116,157,1) solid;
        border-radius:10px;
        margin:10px;
    }

    .marked-exam{
        color:white;
        background-color:#2bb54b;
        border:0px #2bb54b solid;
        border-radius:10px;
                margin:10px;
    }

    .marking-exam{
        color:white;
        background-color:#6e3c9a;
        border:0px #6e3c9a solid;
        border-radius:10px;
                margin:10px;
    }

     .not-marked{
    padding-bottom: 10px;
}

     .marking{
    padding-bottom: 15px;
    font-size:20px;
    font-weight:bold;
}



     number{
         font-weight:bold;
         font-family:arial;
         font-size:30px;
     }


     @media(max-width:768px) {

    .course-detail-title {
        font-size: 36px;
    }
   
    .res2{
        font-size:11px;
        padding-top:10px;
    }

    #registerLink{
    }

    #loginLink{
    }

    .navbar-right{
        visibility:;
    }

    .scroll{
        display:none;
    }
    #logoutForm{
    margin-left:-80px;
}

    #registerLink{
    margin-left:-90px;
}

    #loginLink{
    margin-left:0px;
}
    
}

     .marked a{
         
    font-size:22px;
    font-weight:bold;
    color:white;
     }
     .marked{
         padding-bottom: 15px;
         padding-top:15px;
     }


@media (min-width: 992px) {
    .course-details-content-box {
        height:250px;
        margin-top:30px;
    }
    
    .carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
      width: 100%;
      margin: auto;
      
  }

}
@media (max-width: 992px) {
    .carousel-inner > .item > img,
    .carousel-inner > .item > a > img {
        width: 100%;
        margin: auto;
    }
}

#myCarousel{
    margin-top:120px;
}



.navg-main{
        padding-right: 0;
    padding-left: 15px;
    margin-right: 0;
    margin-left: auto;
  }

.navg-sub-list li{
    display:inline-block;
}
    .navg-sub-list li a {
     padding: 5px 10px 6px 10px;
       color:white;
       font-size:14px;
       display: inline-block;
    vertical-align: middle; 
    }

.navg-sub{
    position:fixed;
    right:5vw;
  }

.navg-sub-list{
    list-style: none;
    white-space:nowrap;
    position:;
    right:5vw;
  }



.carousel-sepearator{
    width:70%;
    border-bottom:1px solid  #dddddd;
    margin-top:20px;
}

.right-controller{
    right:0;
    left:auto;
}

.enroll{
    background-color:orange;
    padding:5px;

}

interpunct{
    color:white;
    font-size:20px;
    font-weight:bold;
}

.upperbar{
    width:100%;
    height:30px;
    background-color:#044772;
}

.intro-pallet-titles{
    color:#00749D;
    text-align:middle;
   margin-top:75px;
}

.middle-banner,
.intro-pallet-titles h1{
    font-weight:bold;
    font-size:50px;
}

.intro-pallet-titles p{
    font-weight:normal;
    font-size:16px;
    text-align:center;
}
.pallet-img,
.pallet-title{
    display: table-cell;
    vertical-align: middle;
    height:350px;
    margin-top:30px;

}

.about-bottom a{
    text-decoration:none;

}
.responsive-show{
        display:none;
    }
@media (max-width: 1200px) {

    .intro-pallet-titles {
        color: #00749D;
        text-align: middle;
        margin-bottom: 75px;
        margin-top:0px;
    }
    
    .responsive-show{
        display:inline;
    }
    .pallet-img,
    .pallet-title{
    display:inline;
    vertical-align:auto;
    height:350px;
    margin-top:10px;

    }
    .responsive-hide{
        display:none;
    }
}

.middle-banner h1{
    color:white;
    font-weight:bold;
}
.middle-banner h2{
    color:white;
    font-weight:normal;
}

.courses-img{
    margin-bottom:20px;
    margin-top:25px;
}

.courses-sub-panel:hover img{
   -webkit-animation: bounce 1.2s ease-out;
	-moz-animation: bounce 800ms ease-out;
	-o-animation: bounce 800ms ease-out;
	animation: bounce 1.2s ease-out;
}

@keyframes bounce {

    0% {
        transform: translateY(-100%);
        opacity: 0;
    }

    5% {
        transform: translateY(-100%);
        opacity: 0;
    }

    15% {
        transform: translateY(0);
    }

    30% {
        transform: translateY(-50%);
    }

    40% {
        transform: translateY(0%);
    }

    50% {
        transform: translateY(-30%);
    }

    70% {
        transform: translateY(0%);
    }

    80% {
        transform: translateY(-15%);
    }

    90% {
        transform: translateY(0%);
    }

    95% {
        transform: translateY(-7%);
    }

    97% {
        transform: translateY(0%);
    }

    99% {
        transform: translateY(-3%);
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

#nivo-lightbox-demo{
    padding-bottom:30px;
}

.logged-menu{
    height:90px;
        margin-top: 30px;
        z-index:999;
}

.student-home-toggle-menu{
    float: right;
    margin: 30px 60px 0 0;
    height:20px;
    width:20px;
 
}

.logged-menu .navg-main{
    margin-bottom:90px;
}

.logged-menu .top-nav ul {
    padding:0 50px 0 0;
}

.logged-menu .top-nav ul li{
    height:90px;
     line-height:50px;
     display: inline-block;
}

.logged-menu .top-nav ul li *{
    vertical-align: middle;
}

#study-materials{
    color:white;
}


#study-materials input{
    background:black;
}

.upperbar{
    width:100%;
    height:30px;
    background-color:#044772;
}

.courses-moocys-logo{
    height:100px;
    width:100px;
    position:absolute;
}

.loggedin-false{
    margin-top:140px;
}

bluebold{
    color:rgba(87,188,229,1);
    font-weight:bold;
}
redbold{
    color:rgba(227,95,95,1);
    font-weight:bold;
}
greenbold{
    color:#03C37E;
    font-weight:bold;
}
.category-table-blue{
    font-size:40px;
    background-color:#1d80c2;
    padding: 20px !important;
}

.category-table-red{
    background-color:#f8565d;
}
.content-table-white{
    background-color:white;
    color:black;
    font-size:18px;
    border: solid 3px #93cef6 !important;
  vertical-align: top;
}

italic{
    font-style:italic;
}

.content-title{
    font-size:50px;
    width:100%;
    padding:30px;
    border-top:3px solid #03C37E;
    border-bottom:3px solid #03C37E;
}

.content-subtitle{
    font-size:30px;
    width:100%;
    padding:30px;
    border-bottom:1px dotted #03C37E;
}

purplebold{
     color:#828bce;
         font-weight:bold;
}

yellowbold{
     color:#eee905;
         font-weight:bold;
}

.passage{
    cursor:pointer;
}

.highlighter { background-color:#FFFE8B }
.highlighter-red { background-color:#FFB6B6 }
.highlighter-green { background-color:#C6FFC1 }
.highlighter-orange { background-color:#FFCA5F }
.highlighter-yellow { background-color:#FFFE8B }
.highlighter-blue { background-color:#C2E9FF }

.passage-content::selection {
    background-color:#FFFE8B;
}
.passage-content-red::selection {
    background-color:#FFB6B6;
}
.passage-content-orange::selection {
    background-color:#FFCA5F;
}

.passage-content-yellow::selection {
    background-color:#FFFE8B;
}

.passage-content-green::selection {
    background-color:#C6FFC1;
}

.passage-content-blue::selection {
    background-color:#C2E9FF;
}


.passage .highlighter::selection {
    background-color:#FFFE8B;
}

.passage .highlighter-red::selection {
    background-color:#FFB6B6;
}
.passage .highlighter-orange::selection {
    background-color:#FFCA5F;
}

.passage .highlighter-yellow::selection {
    background-color:#FFFE8B;
}

.passage .highlighter-green::selection {
    background-color:#C6FFC1;
}
.passage .highlighter-blue::selection {
    background-color:#C2E9FF;
}



.highlighter::selection {
    background-color:none;
}


#square {
	width: 7%;
	height: 30px;
    float:left;

    margin-left:10px;
    cursor:pointer;
}

title_letter{
font-weight:bold;
font-size:26px;
}

.color-panel{
    margin-bottom:30px;
}

.highlight-icon{
    width:30px;
    height:30px;
    float:left;
    margin-left:30px;
}

.eraser-icon{
    width:30px;
    height:30px;
    float:right;
    margin-right:30px;
    cursor:pointer;
}

.question-form{
    margin-bottom:20px;
}

.seperator-white{
    height:3px;
    width:100px;
    background-color:rgba(255,255,255,0.4);
    margin-bottom:20px;
}

.prereg-page{
    margin:50px;
}

.dropdown-list{
    cursor:pointer;
    background-color:black;
    border: 1px solid white; 
    padding: 10px 15px 10px 15px;
    border-radius: 15px;
    color:aquamarine;
    font-size:18px;
    font-weight:bold;
        float: left;
    margin-left: 50px;
}


.dropdown-list option{
    background-color:none;
}

.dropdown-list option:hover{
    background-color:rgba(255,255,255,0.4);
}

option:focus,.dropdown-list:focus{
    outline:none;
    box-shadow:none;
}


select{
    border:none;
}

.courses-main .ser-top{
    padding:0px;
}

.moocys-grad{
    width:100%;
    height:100px;
     background: #00749D; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#00749D, #fff); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#00749D, #fff); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#00749D, #fff); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#00749D, #fff); /* Standard syntax */
}

.moocys-grad-about{
    width:100%;
    height:100px;
     background: #00749D; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#00749D,#044772); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#00749D,#044772); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#00749D,#044772); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#00749D,#044772); /* Standard syntax */
}

.moocys-grad3{
    width:100%;
    height:100px;
     background: #fff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(white,rgba(255,0,255,0) ); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(white, rgba(255,0,255,0)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(white,rgba(255,0,255,0) ); /* For Firefox 3.6 to 15 */
  background: linear-gradient(white, rgba(255,0,255,0)); /* Standard syntax */
}

.moocys-grad2{
    width:100%;
    height:100px;
     background: #fff; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#00749D,rgba(255,0,255,0) ); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#00749D, rgba(255,0,255,0)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#00749D,rgba(255,0,255,0) ); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#00749D, rgba(255,0,255,0)); /* Standard syntax */
}

#bar{
    margin-top:20px;
    margin-bottom:15px;
}

#bar2{
    margin-top:20px;
    margin-bottom:15px;
}

#bar3{
    margin-top:20px;
    margin-bottom:15px;
}


#bar4{
    margin-top:20px;
    margin-bottom:15px;
}


#bar5{
    margin-top:20px;
    margin-bottom:15px;
}


.bi-wrp {
	display:inline-block;
	position:relative;
}
.bi-wrp.bi-horizontal {
	width:100%;
}
.bi-bar {
	position:relative;
    border-radius:10px;
    border: 1px white solid;
    width:100% !important;
}
.bi-vertical .bi-bar { display:table-cell }
.bi-barInner {
	position:absolute;
}
.bi-vertical .bi-barInner {
	width:100%;
	bottom:0;
}

.bi-horizontal .bi-bar { 
	width:100%;
	float: left;
}
.bi-horizontal .bi-barInner {
	top:0;
	bottom:0;
	left:0;
}
.bi-vertical .bi-barInner {
	width:100%;
	bottom:0;
}
.bi-vertical .bi-label {
	display:table-cell;
}
.bi-label-l { padding-right:5px }
.bi-label-r { padding-left:5px }

.bi-hor-topLeft .bi-label,
.bi-hor-topRight .bi-label {	padding-bottom: 5px }
.bi-hor-topLeft .bi-label,
.bi-hor-left .bi-label { float:left }
.bi-hor-topRight .bi-label,
.bi-hor-right .bi-label { float:right }
.bi-hor-left .bi-label,
.bi-hor-right .bi-label { padding:5px }

/* Title ------------------------------------------------ */
.bi-titleSpan { display:inline-block }
.bi-titleSpan.bi-titleSpan-topLeft {
	float:left;
	margin-right:10px;
}
.bi-titleSpan.bi-titleSpan-topRight { }
.bi-titleSpan.bi-titleSpan-left,
.bi-titleSpan.bi-titleSpan-right { width:100% }
.bi-titleSpan.bi-titleSpan-right { text-align:right }

/* Edge labels ------------------------------------------ */
.bi-labelEdge {
	position:absolute;
	top:5px;
	padding:1px 5px;
	border-radius:3px;
	font-size:0.8em;
	background-color:rgba(0,0,0,0.1);
	color:#555;
	z-index:1200;
}
.bi-edge-min { left:-10px }
.bi-edge-max { right:-10px }

/* Limit ------------------------------------------------ */
.bi-limSpan { display:none}

.bi-limSpan {
	padding:3px 5px;
	color:#fff;
	font-size:0.8em;
	margin: 0 5px;
	border-radius:3px;
}

.bi-limSpan-min { background-color:rgb(92, 184, 92) }

.bi-limSpan-max { background-color:rgb(217, 83, 79) }

.bi-limPos-num .bi-label > .bi-limSpan,
.bi-limPos-title > .bi-titleSpan .bi-limSpan { display:inline-block }

.bi-limPos-num.bi-hor-left .bi-label > .bi-limSpan,
.bi-limPos-num.bi-hor-right .bi-label > .bi-limSpan,
.bi-limPos-num > .bi-limSpan,
.bi-limPos-title .bi-label > .bi-limSpan { display:none }
 

/* Label ------------------------------------------------ */
/* Hover */
.bi-label-vis-hover .bi-label { 
	position:absolute;
	background-color: #f1f1f1;
	padding: 5px 10px;
	box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-ms-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 5px 0 rgba(0,0,0,0.5);	
	display:none;
}
.bi-label-vis-hover:hover .bi-label { display:block }
/* Hidden */
.bi-label-vis-hidden .bi-label { display:none }

/* Milestone --------------------------------------------- */
.bi-milestone { 
	position:absolute;
	z-index:1050;
	cursor:pointer;
}
.bi-mlst-inner {
	width:100%;
	height:100%;
	float:left;
	position:relative;
	background-color:transparent;    
}
.bi-mlst-inner.bi-mlst-innerHover { overflow: hidden }
.bi-mlst-inner.bi-mlst-innerHover.bi-mlst-innerOverflowVisible { overflow: visible }

.bi-mlst-innerLine,
.bi-mlst-label {
	display:inline-block;
	position: absolute;
}
.bi-mlst-label { 
	opacity:0;
	transition: all 150ms ease-out;
}
.bi-horizontal .bi-mlst-inner.bi-mlst-innerVisible .bi-mlst-label { opacity:1;display:block }
.bi-horizontal .bi-mlst-inner.bi-mlst-innerHidden .bi-mlst-label { display:none }
.bi-horizontal .bi-mlst-inner.bi-mlst-innerHover:hover .bi-mlst-label { 
	opacity:1;
	top:-28px;
}
.bi-vertical .bi-mlst-inner.bi-mlst-innerHover:hover .bi-mlst-label { 
	opacity:1;
	top:-35px;
}
/* Themes ======================================================= */
/* Default ------------------------------------------------------ */
.bi-wrp.bi-default-theme .bi-bar {
	box-shadow: inset 0 0 10px -3px rgba(0,0,0,0.5);
	-webkit-box-shadow: inset 0 0 10px -3px rgba(0,0,0,0.5);
	-ms-box-shadow: inset 0 0 10px -3px rgba(0,0,0,0.5);
	-o-box-shadow: inset 0 0 10px -3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0 0 10px -3px rgba(0,0,0,0.5);
}
.bi-wrp.bi-default-theme .bi-barInner {
	background-color: #3498db;
}
/* (Default) Bar color variations relative to label value */
.bi-wrp.bi-default-theme.bi-cRange-optimal .bi-barInner { background-color:rgb(92, 184, 92) }
.bi-wrp.bi-default-theme.bi-cRange-alert .bi-barInner { background-color:rgb(217, 170, 79) }
.bi-wrp.bi-default-theme.bi-cRange-critical .bi-barInner { background-color:rgb(217, 83, 79) }

/* (Default) Bar color according to average */
.bi-wrp.bi-default-theme.bi-avgBelow .bi-barInner { background-color:rgb(92, 184, 92) }
.bi-wrp.bi-default-theme.bi-avgAbove .bi-barInner { background-color:rgb(217, 83, 79) }

/* (Default) Milestones */
.bi-wrp.bi-default-theme .bi-milestone {
	background-color:transparent;
}
.bi-wrp.bi-default-theme.bi-vertical .bi-milestone {	
	left:50%;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-milestone {
	top:50%;
}
.bi-wrp.bi-default-theme .bi-mlst-innerLine {
	background-color:;
}
.bi-wrp.bi-default-theme.bi-vertical .bi-mlst-innerLine {
	left:0;
	right:0;
	top:50%;
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-mlst-innerLine {
	top:0;
	bottom:0;
	left:50%;
}
.bi-wrp.bi-default-theme .bi-mlst-label {
	padding:5px;	
	background-color:#555;
	color:#fff;
	border-radius:3px;
	font-size: 0.8em;
	white-space: nowrap;
}
.bi-wrp.bi-default-theme.bi-vertical .bi-mlst-label {
	top:-30px;/*-35px;*/
}
.bi-wrp.bi-default-theme.bi-horizontal .bi-mlst-label {
	top:-23px;/*-28px;*/
}

.continue-button{
      border-radius:10px;
      margin:10px;
      text-align: center;
}
.continue-triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 7px;
    border-color: transparent transparent transparent rgba(255,255,255,0.1);
    vertical-align: middle;
    display: inline-block;
    margin-left:5px;
   transition: border-color 0.5s;
}

.materials-pallet:hover .continue-triangle{
        border-color: transparent transparent transparent rgba(255,255,255,1);
        transition: border-color 0.5s;
}

#bar5 .bi-label{
    color:#044772;
}

.student_home_course_block_subtitle{
    font-size:16px;
    color:rgba(255,255,255,0.7);
    margin-bottom:15px;
}

.student_home_course_block{
    cursor:pointer;
    font-size:24px;
    height:230px;
    background-color:#262626;
    padding:15px;
    margin-bottom:30px;
    text-align:center;
    color:white;
}

.student_home_course_block_subtitle2{
    font-size:12px;
    color:rgba(255,255,255,0.5);
}

.student_home_course_block:hover{
    background-color:#3c3c3c;
}

#reading_progress,#speaking_progress,#writing_progress,#listening_progress,#vocabulary_progress {
  width: 100px;
  height: 100px;
  position: relative;
}

.student-home-welcome{
    margin: 150px 0px 30px 0px;
    padding: ;
    background-color:#262626;
    color:white;
    padding:20px;
}

.radar-chart .level {
  stroke: grey;
  stroke-width: 0.5;
}

.radar-chart .axis line {
 
  stroke-width: 1;
}
.radar-chart .axis .legend {
  font-family: sans-serif;
  font-size: 18px;
  font-weight:bold;
  color:white;
  background-color:white;
}
.radar-chart .axis .legend.top {
  dy:1em;
}
.radar-chart .axis .legend.left {
  text-anchor: start;
}
.radar-chart .axis .legend.middle {
  text-anchor: middle;
}
.radar-chart .axis .legend.right {
  text-anchor: end;
}

.radar-chart .tooltip {
  font-family: sans-serif;
  font-size: 13px;
  transition: opacity 200ms;
  opacity: 0;
}
.radar-chart .tooltip.visible {
  opacity: 1;
}

/* area transition when hovering */
.radar-chart .area {
  stroke-width: 2;
  fill-opacity: 0.5;
}
.radar-chart.focus .area {
  fill-opacity: 0.1;
}
.radar-chart.focus .area.focused {
  fill-opacity: 0.7;
}

.radar-chart .circle {
  fill-opacity: 0.9;
}

/* transitions */
.radar-chart .area, .radar-chart .circle {
  transition: opacity 300ms, fill-opacity 200ms;
  opacity: 1;
}
.radar-chart .d3-enter, .radar-chart .d3-exit {
  opacity: 0;
}

.student-home-panel{
    width:33%;
    display: inline-block;
        vertical-align: top;
}

@media(max-width:1200px) {
    .student-home-panel {
        width: 100%;
        vertical-align: top;
        margin-bottom:20px;
    }
}

.student-home-panel-title{
    border:0px black solid;
    border-radius:0px;
    
    width:auto;
    margin-bottom:10px;
}

.estimate-subheadings{
    margin:0 0 15px 0px;
}

.sample-exam{
    /* width:95%; */
    border-radius:10px;
    border:0px black solid;
    padding:10px;
    margin:10px;
    color:white;
}

.reading-sample-exam{
    background-color:#f8565d; 
}

.written-sample-exam{
    background-color:rgba(0,116,157,1); 
}

.speaking-sample-exam{
    background-color:#2bb54b; 
}

.listening-sample-exam{
    background-color:#6e3c9a; 
}


.sample-exam a{
    color:white;
}

.sample-exam a:hover{
    text-decoration:none;
}

.sample-exam:hover{
    opacity:0.7;
}

.materials-pallet:hover{
    opacity:0.7;
}

.carousel-titles{
    position: absolute;
    color:white;
    left:10%;
    top:15%;
}

.carousel-titles h3{
    font-family:'Microsoft YaHei UI';
    font-size:60px;
    font-weight:bold;
    margin:30px;
}

.carousel-titles h4{
    font-family:'Microsoft YaHei UI';
    font-size:30px;
    margin:30px 0px 15px 30px;
}

.banner-seperator{
    width:90%;
    height:3px;
    background-color:white;
    margin: 0 0px 0 30px;
}

.courses-sub-panel p{
    opacity: 0;
   visibility:hidden;
    transition: visibility 1s, opacity 0.5s linear;
}

.courses-sub-panel:hover p{
    transition: visibility 0s, opacity 1s linear;
      opacity: 1;
    visibility:visible;
}

.rickshaw_graph .detail {
	pointer-events: none;
	position: absolute;
	top: 0;
	z-index: 2;
	background: rgba(0, 0, 0, 0.1);
	bottom: 0;
	width: 1px;
	transition: opacity 0.25s linear;
	-moz-transition: opacity 0.25s linear;
	-o-transition: opacity 0.25s linear;
	-webkit-transition: opacity 0.25s linear;
}
.rickshaw_graph .detail.inactive {
	opacity: 0;
}
.rickshaw_graph .detail .item.active {
	opacity: 1;
}
.rickshaw_graph .detail .x_label {
	font-family: Arial, sans-serif;
	border-radius: 3px;
	padding: 6px;
	opacity: 0.5;
	border: 1px solid #e0e0e0;
	font-size: 12px;
	position: absolute;
	background: white;
	white-space: nowrap;
}
.rickshaw_graph .detail .x_label.left {
	left: 0;
}
.rickshaw_graph .detail .x_label.right {
	right: 0;
}
.rickshaw_graph .detail .item {
	position: absolute;
	z-index: 2;
	border-radius: 3px;
	padding: 0.25em;
	font-size: 12px;
	font-family: Arial, sans-serif;
	opacity: 0;
	background: rgba(0, 0, 0, 0.4);
	color: white;
	border: 1px solid rgba(0, 0, 0, 0.4);
	margin-left: 1em;
	margin-right: 1em;
	margin-top: -1em;
	white-space: nowrap;
}
.rickshaw_graph .detail .item.left {
	left: 0;
}
.rickshaw_graph .detail .item.right {
	right: 0;
}
.rickshaw_graph .detail .item.active {
	opacity: 1;
	background: rgba(0, 0, 0, 0.8);
}
.rickshaw_graph .detail .item:after {
	position: absolute;
	display: block;
	width: 0;
	height: 0;

	content: "";

	border: 5px solid transparent;
}
.rickshaw_graph .detail .item.left:after {
	top: 1em;
	left: -5px;
	margin-top: -5px;
	border-right-color: rgba(0, 0, 0, 0.8);
	border-left-width: 0;
}
.rickshaw_graph .detail .item.right:after {
	top: 1em;
	right: -5px;
	margin-top: -5px;
	border-left-color: rgba(0, 0, 0, 0.8);
	border-right-width: 0;
}
.rickshaw_graph .detail .dot {
	width: 4px;
	height: 4px;
	margin-left: -3px;
	margin-top: -3.5px;
	border-radius: 5px;
	position: absolute;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.6);
	box-sizing: content-box;
	-moz-box-sizing: content-box;
	background: white;
	border-width: 2px;
	border-style: solid;
	display: none;
	background-clip: padding-box;
}
.rickshaw_graph .detail .dot.active {
	display: block;
}
/* graph */

.rickshaw_graph {
	position: relative;
}
.rickshaw_graph svg {
	display: block;	
	overflow: hidden;
}

/* ticks */

.rickshaw_graph .x_tick {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 0px;
	border-left: 1px dotted rgba(0, 0, 0, 0.2);
	pointer-events: none;
}
.rickshaw_graph .x_tick .title {
	position: absolute;
	font-size: 12px;
	font-family: Arial, sans-serif;
	opacity: 0.5;
	white-space: nowrap;
	margin-left: 3px;
	bottom: 1px;
}

/* annotations */

.rickshaw_annotation_timeline {
	height: 1px;
	border-top: 1px solid #e0e0e0;
	margin-top: 10px;
	position: relative;
}
.rickshaw_annotation_timeline .annotation {
	position: absolute;
	height: 6px;
	width: 6px;
	margin-left: -2px;
	top: -3px;
	border-radius: 5px;
	background-color: rgba(0, 0, 0, 0.25);
}
.rickshaw_graph .annotation_line {
	position: absolute;
	top: 0;
	bottom: -6px;
	width: 0px;
	border-left: 2px solid rgba(0, 0, 0, 0.3);
	display: none;
}
.rickshaw_graph .annotation_line.active {
	display: block;
}

.rickshaw_graph .annotation_range {
        background: rgba(0, 0, 0, 0.1);
        display: none;
        position: absolute;
        top: 0;
        bottom: -6px;
}
.rickshaw_graph .annotation_range.active {
        display: block;
}
.rickshaw_graph .annotation_range.active.offscreen {
        display: none;
}

.rickshaw_annotation_timeline .annotation .content {
	background: white;
	color: black;
	opacity: 0.9;
	padding: 5px 5px;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
	border-radius: 3px;
	position: relative;
	z-index: 20;
	font-size: 12px;
	padding: 6px 8px 8px;
	top: 18px;
	left: -11px;
	width: 160px;
	display: none;
	cursor: pointer;
}
.rickshaw_annotation_timeline .annotation .content:before {
	content: "\25b2";
	position: absolute;
	top: -11px;
	color: white;
	text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.8);
}
.rickshaw_annotation_timeline .annotation.active,
.rickshaw_annotation_timeline .annotation:hover {
	background-color: rgba(0, 0, 0, 0.8);
	cursor: none;
}
.rickshaw_annotation_timeline .annotation .content:hover {
	z-index: 50;
}
.rickshaw_annotation_timeline .annotation.active .content {
	display: block;
}
.rickshaw_annotation_timeline .annotation:hover .content {
	display: block;
	z-index: 50;
}
.rickshaw_graph .y_axis,
.rickshaw_graph  .x_axis_d3 {
	fill: none;
}
.rickshaw_graph .y_ticks .tick line,
.rickshaw_graph .x_ticks_d3 .tick {
	stroke: rgba(0, 0, 0, 0.16);
	stroke-width: 2px;
	shape-rendering: crisp-edges;
	pointer-events: none;
}
.rickshaw_graph .y_grid .tick,
.rickshaw_graph .x_grid_d3 .tick {
	z-index: -1;
	stroke: rgba(0, 0, 0, 0.20);
	stroke-width: 1px;
	stroke-dasharray: 1 1;
}
.rickshaw_graph .y_grid .tick[data-y-value="0"] {
	stroke-dasharray: 1 0;
}
.rickshaw_graph .y_grid path,
.rickshaw_graph .x_grid_d3 path  {
	fill: none;
	stroke: none;
}
.rickshaw_graph .y_ticks path,
.rickshaw_graph .x_ticks_d3 path {
	fill: none;
	stroke: #808080;
}
.rickshaw_graph .y_ticks text,
.rickshaw_graph .x_ticks_d3 text {
	opacity: 0.5;
	font-size: 12px;
	pointer-events: none;
}
.rickshaw_graph .x_tick.glow .title,
.rickshaw_graph .y_ticks.glow text {
	fill: black;
	color: black;
	text-shadow: 
		-1px 1px 0 rgba(255, 255, 255, 0.1),
		1px -1px 0 rgba(255, 255, 255, 0.1),
		1px 1px 0 rgba(255, 255, 255, 0.1),
		0px 1px 0 rgba(255, 255, 255, 0.1),
		0px -1px 0 rgba(255, 255, 255, 0.1),
		1px 0px 0 rgba(255, 255, 255, 0.1),
		-1px 0px 0 rgba(255, 255, 255, 0.1),
		-1px -1px 0 rgba(255, 255, 255, 0.1);
}
.rickshaw_graph .x_tick.inverse .title,
.rickshaw_graph .y_ticks.inverse text {
	fill: white;
	color: white;
	text-shadow: 
		-1px 1px 0 rgba(0, 0, 0, 0.8),
		1px -1px 0 rgba(0, 0, 0, 0.8),
		1px 1px 0 rgba(0, 0, 0, 0.8),
		0px 1px 0 rgba(0, 0, 0, 0.8),
		0px -1px 0 rgba(0, 0, 0, 0.8),
		1px 0px 0 rgba(0, 0, 0, 0.8),
		-1px 0px 0 rgba(0, 0, 0, 0.8),
		-1px -1px 0 rgba(0, 0, 0, 0.8);
}
.rickshaw_legend {
	font-family: Arial;
	font-size: 12px;
	color: white;
	background: #404040;
	display: inline-block;
	padding: 12px 5px; 
	border-radius: 2px;
	position: relative;
}
.rickshaw_legend:hover {
	z-index: 10;
}
.rickshaw_legend .swatch {
	width: 10px;
	height: 10px;
	border: 1px solid rgba(0, 0, 0, 0.2);
}
.rickshaw_legend .line {
	clear: both;
	line-height: 140%;
	padding-right: 15px;
}
.rickshaw_legend .line .swatch {
	display: inline-block;
	margin-right: 3px;
	border-radius: 2px;
}
.rickshaw_legend .label {
	margin: 0;
	white-space: nowrap;
	display: inline;
	font-size: inherit;
	background-color: transparent;
	color: inherit;
	font-weight: normal;
	line-height: normal;
	padding: 0px;
	text-shadow: none;
}
.rickshaw_legend .action:hover {
	opacity: 0.6;
}
.rickshaw_legend .action {
	margin-right: 0.2em;
	font-size: 10px;
	opacity: 0.2;
	cursor: pointer;
	font-size: 14px;
}
.rickshaw_legend .line.disabled {
	opacity: 0.4;
}
.rickshaw_legend ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	margin: 2px;
	cursor: pointer;
}
.rickshaw_legend li {
	padding: 0 0 0 2px;
	min-width: 80px;
	white-space: nowrap;
}
.rickshaw_legend li:hover {
	background: rgba(255, 255, 255, 0.08);
	border-radius: 3px;
}
.rickshaw_legend li:active {
	background: rgba(255, 255, 255, 0.2);
	border-radius: 3px;
}

subscription-title{
    font-family:"Microsoft YaHei";
    font-size:30px;
    color:#044772;
    font-weight:bold;
}

subscription-subtitle{
    margin-top:10px;
    color:#044772;

}

@media(max-width:1582px) {
    .middle-banner, .intro-pallet-titles h1{
       font-size:45px;
    }
}

@media(max-width:578px) {
    .middle-banner, .intro-pallet-titles h1{
       font-size:35px;
    }
}

@media(max-width:460px) {
    .middle-banner, .intro-pallet-titles h1{
       font-size:25px;
    }
}

@media(max-width:536px){
.about-banner-height{
    height:70vh;
}


}

.moocys p{
    text-align:left;
}

.professor-body {
    margin-top: 150px;
}
.fullwidthlayout{
     margin-top:20vh;
 
}

.logon_title{
    color:#00689E;
    font-size:30px;
    font-weight:;
    margin-bottom:10px;
}

.seperator_login{
    width:60px;
    height:3px;
    margin:10px;
    background-color:#3cb0fd;
}

.mainlogonform .form-group{
    text-align:left;
    width:250px;
}

.mainlogonform .form-group label{
    font-weight:normal;
    color:grey;
    font-size:14px;
    margin-left:5px;
}

.mainlogonform .form-group input.form-control {
    border-radius:5px;
}


.fullwidthlayout .checkbox {
        width: 100px;
        font-size:14px;
    text-align: left;
    margin-left:10px;
}

.reg_link{
    margin-left:20px;
}

.mainlogonform .btn-mvc-large {
    width:auto;
    padding: 5px 15px 5px 15px;
     font-size:17px;
}

.mainregisterform .btn-mvc-large {
    width:auto;
    padding: 5px 15px 5px 15px;
     font-size:17px;
}

.mainregisterform .form-group{
    text-align:left;
    width:250px;
}

.mainregisterform .form-group label{
    font-weight:normal;
    color:grey;
    font-size:14px;
    margin-left:5px;
}

.mainregisterform .form-group input.form-control {
    border-radius:5px;
}


.fullwidthlayout .row{
    margin:0 0 0 0;
}

.logon_title {
    font-family: 'Microsoft YaHei';
} 

@media (max-width: 768px){
    #myCarousel{
        display:none;
    }

}
.ng-submitted input[type="checkbox"].ng-invalid +label, .ng-submitted input[type="radio"].ng-invalid +label, .ng-submitted input[type="text"].ng-invalid {
	border-color:red;
}

.menu-block{
    height:90px;
    width:auto;
    position: absolute;
    top: 30px;
    color:white;
    right:5vw;
}

.menu-block-slice{
    float:right;
    padding: 0px 15px 0px 15px;
    text-align: center;
    height:100%;
}

.menu-block-slice:hover{
    background-color:rgba(0,116,157,1);
    
}

.menu-block-slice {
    color:white;

 
    font-size:18px;
    font-weight:normal;
}


@media (max-width: 768px){
    .menu-block{
        display:none;
    }

}
@media (min-width: 768px){
    .res2{
        display:none !important;
    }

}


.menu-block-link{
    position: relative;
    top: 35%;
}

.res2{
    background-color:rgba(255,255,255,0.9);
    height:100vh;
    width:100vw;
    position:fixed;
    top:0px;
    left:0px;
    margin-top:120px;
}

.menu-title{
    margin-top:50px;
    font-size:24px;
}

.menu-title a{ 
   padding:20px;
}

.menu-title a:hover{ 
    text-decoration:none;
   color:aqua;
}

.responsive-menu{
        text-align: center;

}

.hex_mid{
    color:white;
    vertical-align:middle;
}

.hex_grammar{
       width:255px;
    color:white;
    vertical-align:middle;
    display: inline-block;
    text-align:right;
}

.hex_reading{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    margin-right:75px;
}
.hex_vocab{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    margin-left:75px;
}

.hex_speaking{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    margin-right:75px;
}
.hex_writing{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    margin-left:75px;
}
.hex{
    font-size:15px;
}
@media (min-width: 899px){
    .hex_container2{
        display:none;
    }


}
.hex_container2{
    color:white;
    font-weight:bold;
}
hex_title{
    font-size:20px;
    margin:15px;
}
.hex_container2 .hex_reading,.hex_container2 .hex_vocab,.hex_container2 .hex_writing,.hex_container2 .hex_grammar,.hex_container2 .hex_listening,.hex_container2 .hex_speaking{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    margin:0px;
    text-align:center;
}
@media (max-width: 899px){
    .hex_container{
        display:none;
    }


}
.hex_reading_content{
    opacity:0;
    display:none;
}
.hex_reading:hover .hex_reading_content{
    transition:opacity 0.5s ease-in-out;
    opacity:1;
    position:center;
    display:inline-block;
}
.hex_reading:hover h2,.hex_reading:hover h3{
   opacity:0;
    transition:opacity 0.5s ease-in-out ;
    cursor:default;
        display:none;
}

.hex_reading h2,.hex_reading h3{
   opacity:1;
    transition:opacity 0.5s ease-in-out ;
    cursor:default
}

.hex_listening{
    width:255px;
color:white;
    vertical-align:middle;
    display: inline-block;
    text-align:left;
    -webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
-webkit-touch-callout: default  ; /* displays the callout */
-webkit-touch-callout: none      /* disables the callout */
}

@media(min-width:768px) {
    .student-home-toggle-menu{
        display:none;
    }
}
.phrase {
    font-size: 60px;
    text-align:center;
    margin:10px 0 50px 0;
}

.hex h2{
    font-size:40px;
    margin-top:0px;
    font-weight:bold;
}

.hex h3{
    background-color:rgba(255,255,255,0);
       position:unset;
    font-size:20px;
    font-family: raleway;
    width:auto;
}

#study-materials .vocab_submit{
    border-radius:10px;
    border:rgba(255,255,255,0.5) 3px solid !important;
  height:50px;
    width:125px;
    padding:0px;
    padding:0px;
     margin-top:50px;
}

#study-materials .vocab_next{
    border-radius:10px;
    border:rgba(255,255,255,0.5) 3px solid !important;
    height:50px;
    width:125px;
    padding:0px;
    margin-top:60px;
}

.vocab_title{
    margin-left:30px;
    color:white;
}

.vocab_question_label{
    margin:10px;
    text-align:center;
    padding:15px !important;
}

input[type="radio"]:checked + .vocab_question_label{
    margin:10px;
    text-align:center;
    padding:25px !important;
}

#study-materials .vocab_submit:hover, #study-materials .vocab_next:hover{
    background-color:rgba(255,255,255,0.2);
     transition: background-color 250ms linear;
     transition: box-shadow 150ms linear;
     -moz-box-shadow: 0 0 25px rgba(255,255,255,0.5);
-webkit-box-shadow: 0 0 25px rgba(255,255,255,0.5);
box-shadow: 0px 0px 25px rgba(255,255,255,0.5);
    border:rgba(255,255,255,0.5) 3px solid !important;
 
}

#study-materials .vocab_submit:active, #study-materials .vocab_next:active{
    background:black;
    color:#d0d0d0;
    border: gray;
}

#study-materials .vocab_submit:focus, #study-materials .vocab_next:focus{
    outline:0;
}


.definition{
    text-align:center;
    font-size:22px;
}

.show-hide-5s {
    opacity:1;
}

.show-hide-5s.ng-hide-remove {
  transition: all linear 5s;
}

.show-hide-5s.ng-hide {
    opacity: 0;
}


.shaded-box{
        text-align: center;
    padding: 10px;
    background: rgba(255,255,255,0.3);
    margin: 20px;
}

.question_content{
    text-align:left;
    margin:20px;
    display:none;
}
.question_title{
    text-align:left;
    margin:20px;
    font-weight:bold;
    font-size:20px;
}

.tapescript_toggle{
    cursor: pointer;
    text-align: center;
}

.speech td{
    vertical-align:top;
    padding-right:10px;
    padding-bottom: 10px;
}

.boxed{
    margin:20px;
    background:rgba(255,255,255,0.3);
    padding:20px;
    border-radius:20px;

}


.box_grid{
    width:25%;
    background:rgba(255,255,255,0.3);
      border:3px solid black;
}

.box_table_2 td{
    width:20%;
    border:black 3px solid;
        background:rgba(255,255,255,0.3);
        padding:5px;
}

input{
    margin:10px;
}

.student_home_body{
    background-image:url(../images/moocys/blackboard.jpg);
    background-repeat: repeat;
    
}

badge{
    height:90px;
    width:90px;
    float:left;
}
badge img{
    height:100%;
    width:100%;
    float:;
}

.unearned_badge{
    opacity:0.1;
}

.estimate_score_container{
        white-space: nowrap;
}

.estimate_bar{
    background:rgba(255,255,255,0.1);
    border:rgba(255,255,255,0) solid 3px;
    width:90%;
    height:30px;
    margin-bottom:15px;
    float:left;
}

.reading_bar{
    background:#f8565d;
    border:rgba(255,255,255,0) solid 3px;
    width:50%;
    height:24px;
    font-size:13px;
    font-weight:bold;
    font-family:'Microsoft YaHei UI';
}
.estimation_result{
    display:inline-block;
    width:10%;
    float:left;
    color:rgba(255,255,255,0.5);
    font-size:12px;
    text-align:center;
    vertical-align:middle;
    margin-top:6px;
}
.writing_bar{
    background:#1d80c2;
    border:rgba(255,255,255,0) solid 3px;
    width:30%;
    height:24px;
    font-size:13px;
    font-weight:bold;
    font-family:'Microsoft YaHei UI';
}

.listening_bar{
    background:#735590;
    border:rgba(255,255,255,0) solid 3px;
    width:30%;
    height:24px;
    font-size:13px;
    font-weight:bold;
    font-family:'Microsoft YaHei UI';
}

.speaking_bar{
    background:#038b38;
    border:rgba(255,255,255,0) solid 3px;
    width:30%;
    height:24px;
    font-size:13px;
    font-weight:bold;
    font-family:'Microsoft YaHei UI';
}

.overall_bar{
    background:#038b38;
    border:rgba(255,255,255,0) solid 3px;
    width:30%;
    height:24px;
    font-size:13px;
    font-weight:bold;
    font-family:'Microsoft YaHei UI';
}

.admissions {
    padding: 5.5em 0em 5.5em 0em;
}

.admission-grid {
    margin: 80px 0px 0px 0px;
}

.admission-grid h4 {
    font-size: 70px;
      background: -webkit-linear-gradient(#FFF94A, #F0AD1E);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.admission-bottom{
    margin-bottom:20px;
}

.admission-grid h3 {
    font-family: 'Microsoft YaHei';
    font-size: 1.8em;
    font-weight:bold;
}
.admission-top p{
          background: -webkit-linear-gradient(#bbbbbb, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.admission-grid p {
    font-family: 'Microsoft YaHei';
    font-size: 1em;
    line-height: 1.5em;
    border:0px solid white;
}

.writing-material-class img{
    margin:30px;
}

.banner {
    min-height: 800px;
}

.legend{
    margin:0px !important;
    display: inline-block;
}

.take_exams_h1{
    margin-top:150px;
    color:#cccccc;
}

.take_exam_content{
    color:#cccccc;
}

.take_exam_content p{
margin-bottom:15px;
margin-left:0px;
}
.take_exam_content h5{
margin-bottom:20px;
font-size:16px;
font-weight:bold;
}
.take_exam_content p em{
    font-weight:bold;
    font-style:normal;
    font-size:25px;
     color:#7fd99a;
}
.take_exam_content label{
    text-align:left !important;
}
.control-label{
    font-size:20px;
    padding:7px !important;
        background: white;
    color: black;
    border-radius:20px;

}

.question-text{
    padding:10px;
    background:white;
    color:black;
    font-weight:bold;
    border-radius:20px;
}

.question-text p {
    margin:0px !important;
}

.take_exam_content 
input[type="checkbox"],
.take_exam_content  input[type="radio"] {
    display:none;
}

.take_exam_content input[type="checkbox"] + label,
.take_exam_content input[type="radio"] + label  {
    width:100%;
    display:inline-block;
    /* border:black 1px solid; */
    padding:10px 10px 10px 30px;
    -webkit-transition: all 0.20s;
    -moz-transition: all 0.20s;
    -o-transition: all 0.20s;
    transition: all 0.20s;
    border-radius:20px;
    border:dotted 1px rgba(255,255,255,0.3);
    cursor:pointer;
    /*background:url(../icons/courses/checkbox.png) left top no-repeat;*/
}

.take_exam_content input[type="checkbox"] + label:hover,
.take_exam_content input[type="radio"] + label:hover  {
     background-color:rgba(255,255,255,0.1);
}

.take_exam_content input[type="checkbox"]:checked + label,
.take_exam_content input[type="radio"]:checked + label  {
    width:100%;
    -webkit-transition: all 0.50s;
    -moz-transition: all 0.50s;
    -o-transition: all 0.50s;
     transition: all 0.50s;
    background-color:rgba(255,255,255,0.2);
    border:white 1px solid;
    padding:10px 10px 10px 30px;
    border-radius:20px;
}

.take_exam_content input[type="checkbox"]+ label:before,
.take_exam_content input[type="radio"] + label:before {
   content: "";
  display: inline-block;
 
  width: 16px;
  height: 16px;
 
  position: relative;

  bottom:-2px;
  right:15px;
  background-color: ;
  border-radius:10px;
  box-shadow: 0 0 0 1px white;
  border:black 2px solid;
}

.take_exam_content input[type="checkbox"]:checked + label:before,
.take_exam_content input[type="radio"]:checked + label:before {
  display: inline-block;
     
  width: 16px;
  height: 16px;
 
  position: relative;
    background-color:white;
  bottom:-2px;
  right:15px;
  background-color: #6ce15e;
  border-radius:10px;
  border:1px solid #6ce15e;
     -webkit-transition: background-color 1000ms linear;
        -moz-transition: background-color 1000ms linear;
        -o-transition: background-color 1000ms linear;
        -ms-transition: background-color 1000ms linear;
        transition: background-color 1000ms linear;
}

.take_exam_content .form-group p{
    margin-bottom:10px;

}

.take_exam_content input[type="submit"],
.take_exam_content button,
.take_exam_content a.btn{
    background: #448cba;
    text-decoration: none;
    padding:13px;
    margin:10px 0 30px 0;
    color:white;
    font-weight:bold;
    text-transform: uppercase;
    font-size:13px;
    border-radius: 25px;
    outline: none;
    border-width: 0px;
}
.take_exam_content input[type="submit"]:hover,
.take_exam_content button:hover,
.take_exam_content a:hover.btn{
    background: #69c2fe;
    color:white;
}

.take_exam_content textarea{
    /* margin-bottom:100px; */
}

.take_exam_content img {
  display: block;
  max-width: 100%;
  height: auto;
}

@media (max-width: 992px) {
    .take_exam_content .control-label {
        margin-left:15px;
        margin-right:15px;
           }
}

.blurred{
    opacity:0.1;
}

.overlay{
display: inline-block;
}




.vocab-button{
       -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0px;
    font-family: 'Microsoft YaHei';
    color: #ffffff;
    font-size: 20px;
    background: rgba(0,116,157,1);
    padding: 12px 45px 12px 45px;
    text-decoration: none;
    border: 0;
    margin-bottom: 50px;
    border: 1px solid rgba(0,116,157,1);
    border-radius:30px;
}

.vocab-button:hover{
    background: #6ac4ff;
    

}

.chart-container text{
    color:white;
}

.study-material{
    height:80vh;
}

.study-material h1{
    font-family:chalk;
}

.bullet-point-container img{
    width:25px;
    height:25px;
    
}



.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: 150px;
  height: 150px;
  border-radius: 50%;
}
.ih-item.circle .img {
  position: relative;
  width: 150px;
  height: 150px;
  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.5);
  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 {
    width:auto;
    top:0px;
    background-color:rgba(0, 0, 0, 0.0);
  color: #fff;
  text-transform: uppercase;
  position: relative;
  letter-spacing: 2px;
  font-size: 22px;
  margin: 0 30px;
  padding: 15px 0 0 0;
  height: 50px;
  text-shadow: 0 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.3);
}
.ih-item.circle.effect2 .info p {
  color: white;
  padding: 10px 5px;
  font-style: ;
  margin: 0 10px;
  font-size: 12px;
}

.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 {
    width:auto;
    top:0px;
    background-color:rgba(0, 0, 0, 0.0);

  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);
}

.ih-item{
    display:inline-block;
}
.hex-left-top{
    margin-right:70px;
}

.hex-left-bottom{
    margin-right:70px;
}

.hex-left{
    margin-right:30px;
}

.hex-right{
    margin-left:30px;
}