/*************

-- Image Hover Effects --
-- Following Styles Included --

1. google font attachments
2. ct_icon_effect1
3. ct_icon_effect2
4. ct_icon_effect3
5. ct_icon_effect4
6. ct_icon_effect5
7. ct_icon_effect6
8. ct_icon_effect7
9. ct_icon_effect8
10. ct_icon_effect9
11. ct_icon_effect10
12. ct_icon_effect11
13. ct_icon_effect12
14. ct_icon_effect13
15. ct_icon_effect14

**********/

/****** google font attachments ******/

@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,500,900);
@import url(https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700,900);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400);
@import url(https://fonts.googleapis.com/css?family=Poppins:300);
@import url(https://fonts.googleapis.com/css?family=Sacramento);
@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://fonts.googleapis.com/css?family=Oswald);

/****** ct_icon_effect1 ******/

.ct_icon_effect1 {
  font-family: 'Lato', Arial, sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #000000;
  font-size: 16px;
  line-height: 1.2em;
  text-align: center;
}

.ct_icon_effect1 *,
.ct_icon_effect1 *:before,
.ct_icon_effect1 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.ct_icon_effect1:before {
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
  content: '';
  background-color: #ffffff;
  opacity: 0;
  -webkit-transform: scale(0.1);
  transform: scale(0.1);
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.ct_icon_effect1 img {
  max-width: 100%;
  vertical-align: top;
}

.ct_icon_effect1 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  opacity: 0;
  padding: 0 30px;
}

.ct_icon_effect1 h3 {
  margin: 0 0 6px;
  text-transform: uppercase;
  font-size: 1.1em;
  letter-spacing: 2px;
}

.ct_icon_effect1 p {
  margin: 0 0 10px;
  opacity: 0.6;
}

.ct_icon_effect1 .icons {
  width: 100%;
}

.ct_icon_effect1 a {
  margin: 2px;
  display: inline-block;
}

.ct_icon_effect1 a i {
  background-color: #333333;
  border-radius: 3px;
  color: #000000;
  display: block;
  font-size: 20px;
  line-height: 34px;
  text-align: center;
  width: 34px;
}

.ct_icon_effect1 a i:before {
  color: #fff;
}

.ct_icon_effect1 a i:hover {
  background-color: #D2B17F;
  cursor: pointer;
}

.ct_icon_effect1:hover:before,
.ct_icon_effect1.hover:before {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.ct_icon_effect1:hover figcaption,
.ct_icon_effect1.hover figcaption {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  opacity: 1;
}

/****** ct_icon_effect2 ******/

.ct_icon_effect2 {
  font-family: 'Source Sans Pro', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  height: 245px;
  color: #ffffff;
  text-align: center;
  font-size: 16px;
}
.ct_icon_effect2 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect2 img {
  opacity: 1;
  width: 100%;
}
.ct_icon_effect2:after,
.ct_icon_effect2:before,
.ct_icon_effect2 figcaption:after,
.ct_icon_effect2 figcaption:before {
  background: #0a0a0a;
  width: 25%;
  position: absolute;
  content: '';
  opacity: 0;
  -webkit-transition: all 0.3s steps(4);
  transition: all 0.3s steps(4);
  z-index: 1;
  top: 100%;
  bottom: 0;
}
.ct_icon_effect2:before {
  left: 0;
  -webkit-transition-delay: 0;
  transition-delay: 0;
}
.ct_icon_effect2:after {
  left: 25%;
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
.ct_icon_effect2 figcaption:before {
  left: 50%;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  z-index: -1;
}
.ct_icon_effect2 figcaption:after {
  left: 75%;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
  z-index: -1;
}
.ct_icon_effect2 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  padding: 60px 30px 30px;
}
.ct_icon_effect2 h2,
.ct_icon_effect2 p,
.ct_icon_effect2 .icons {
  margin: 0;
  width: 100%;
  opacity: 0;
}
.ct_icon_effect2 h2 {
  font-weight: 900;
  color: #fff;
  font-size: 24px;
  line-height: 40px;
}
.ct_icon_effect2 p {
  font-weight: 300;
  line-height: 20px;
}
.ct_icon_effect2 .icons {
  position: absolute;
  bottom: 30px;
  left: 0;
  width: 100%;
}
.ct_icon_effect2 i {
  padding: 0px 10px;
  display: inline-block;
  font-size: 24px;
  color: #ffffff;
  text-align: center;
  opacity: 0.8;
}
.ct_icon_effect2 i:hover {
  opacity: 1;
}
.ct_icon_effect2:hover:after,
.ct_icon_effect2.hover:after,
.ct_icon_effect2:hover:before,
.ct_icon_effect2.hover:before,
.ct_icon_effect2:hover figcaption:after,
.ct_icon_effect2.hover figcaption:after,
.ct_icon_effect2:hover figcaption:before,
.ct_icon_effect2.hover figcaption:before {
  top: 0;
  opacity: 0.8;
}
.ct_icon_effect2:hover figcaption h2,
.ct_icon_effect2.hover figcaption h2,
.ct_icon_effect2:hover figcaption p,
.ct_icon_effect2.hover figcaption p,
.ct_icon_effect2:hover figcaption .icons,
.ct_icon_effect2.hover figcaption .icons {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}
.ct_icon_effect2:hover figcaption h2,
.ct_icon_effect2.hover figcaption h2,
.ct_icon_effect2:hover figcaption .icons,
.ct_icon_effect2.hover figcaption .icons {
  opacity: 1;
}
.ct_icon_effect2:hover figcaption p,
.ct_icon_effect2.hover figcaption p {
  opacity: 0.7;
}

/****** ct_icon_effect3 ******/

.ct_icon_effect3 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: left;
  font-size: 16px;
  background: #ffffff;
}

.ct_icon_effect3 *,
.ct_icon_effect3:before,
.ct_icon_effect3:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.ct_icon_effect3 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}

.ct_icon_effect3:before,
.ct_icon_effect3:after {
  content: '';
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.ct_icon_effect3:before {
  width: 300px;
  height: 2px;
}

.ct_icon_effect3:after {
  height: 300px;
  width: 2px;
}

.ct_icon_effect3 figcaption {
  position: absolute;
  left: 0;
  bottom: 0;
}

.ct_icon_effect3 h3 {
  font-weight: 400;
  font-size: 18.7px;
  line-height: 22px;
  padding: 8px 15px;
  margin: 0;
  opacity: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}

.ct_icon_effect3 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect3:hover img,
.ct_icon_effect3.hover img {
  zoom: 1;
  filter: alpha(opacity=25);
  -webkit-opacity: 0.25;
  opacity: 0.25;
}

.ct_icon_effect3:hover:before,
.ct_icon_effect3.hover:before,
.ct_icon_effect3:hover:after,
.ct_icon_effect3.hover:after {
  opacity: 1;
}

.ct_icon_effect3:hover:before,
.ct_icon_effect3.hover:before {
  width: 50px;
}

.ct_icon_effect3:hover:after,
.ct_icon_effect3.hover:after {
  height: 50px;
}

.ct_icon_effect3:hover h3,
.ct_icon_effect3.hover h3 {
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
  opacity: 1;
}

/****** ct_icon_effect4 ******/

figure.ct_icon_effect4 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
}
figure.ct_icon_effect4 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
figure.ct_icon_effect4 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect4 figcaption {
  background-color: rgba(42, 128, 185, 0.75);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
figure.ct_icon_effect4 h3 {
  text-align: center;
  font-size: 1.3em;
  padding: 10px;
  margin: 0;
  font-weight: 400;
  color: #fff;
}
figure.ct_icon_effect4:hover h3 {
color: rgba(42, 128, 185, 0.75);
}
figure.ct_icon_effect4:before {
  background: rgba(42, 128, 185, 0.75);
  content: "";
  left: 0;
  right: 0;
  bottom: 100%;
  top: 0;
  position: absolute;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
figure.ct_icon_effect4 i {
  position: absolute;
  font-size: 3.5em;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50px);
  transform: translate(-50%, -50px);
  opacity: 0;
}
figure.ct_icon_effect4 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect4:hover:before,
figure.ct_icon_effect4.hover:before {
  bottom: 0;
}
figure.ct_icon_effect4:hover i,
figure.ct_icon_effect4.hover i {
  opacity: 1;
}
figure.ct_icon_effect4:hover figcaption,
figure.ct_icon_effect4.hover figcaption {
  background-color: #ffffff;
  color: rgba(42, 128, 185, 0.75);
}


/****** ct_icon_effect5 ******/

.ct_icon_effect5 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  text-transform: uppercase;
  box-shadow: none !important;
}
.ct_icon_effect5:first-of-type {
  margin-left: 10px;
}
.ct_icon_effect5 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect5 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
  position: relative;
  opacity: 0.7;
}
.ct_icon_effect5 figcaption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #0d0d0d;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
.ct_icon_effect5 h4 {
  width: 100%;
  margin: 0;
  padding: 15px 20px;
  line-height: 1.1em;
  font-weight: 900;
  color: #fff;
}
.ct_icon_effect5 i {
  position: absolute;
  right: 0;
  top: 0;
  padding: 8px 20px;
  font-size: 26px;
}
.ct_icon_effect5 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.ct_icon_effect5:hover img,
.ct_icon_effect5.hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  opacity: 1;
}
.ct_icon_effect5:hover figcaption,
.ct_icon_effect5.hover figcaption {
  -webkit-transform: translateY(2%);
  transform: translateY(2%);
}

/****** ct_icon_effect6 ******/

figure.ct_icon_effect6 {
  font-family: 'Roboto', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  line-height: 1.4em;
}
figure.ct_icon_effect6 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
figure.ct_icon_effect6 img {
  opacity: 1;
  width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect6 h3 {
  position: absolute;
  top: 0%;
  width: 100%;
  background-color: #212121;
  color: #fff;
  z-index: 1;
  text-align: right;
  padding: 15px 25px 0px;
  margin: 0;
  font-weight: 300;
  font-size: 1.3em;
  -webkit-transform: translateY(-200%);
  transform: translateY(-200%);
}
figure.ct_icon_effect6 h3:before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 600px 80px 0;
  border-color: transparent #212121 transparent transparent;
}
figure.ct_icon_effect6 figcaption {
  padding: 20px 25px 15px;
  position: absolute;
  width: 100%;
  z-index: 2;
  bottom: 0%;
  background-color: #141414;
  -webkit-transform: translateY(200%);
  transform: translateY(200%);
}
figure.ct_icon_effect6 figcaption:before {
  position: absolute;
  content: '';
  bottom: 100%;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 80px 0 0 600px;
  border-color: transparent transparent transparent #141414;
}
figure.ct_icon_effect6 .icons {
  margin-top: -20px;
}
figure.ct_icon_effect6 i {
  padding: 0px 8px;
  display: inline-block;
  font-size: 24px;
  color: #ffffff;
  text-align: center;
  opacity: 0.7;
}
figure.ct_icon_effect6 i:hover {
  opacity: 1;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
figure.ct_icon_effect6:hover h3,
figure.ct_icon_effect6.hover h3 {
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
}
figure.ct_icon_effect6:hover figcaption,
figure.ct_icon_effect6.hover figcaption {
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
}

/****** ct_icon_effect7 ******/

figure.ct_icon_effect7 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: center;
  font-size: 16px;
  -webkit-perspective: 50em;
  perspective: 50em;
  background-color: #000000;
  text-transform: uppercase;
}

figure.ct_icon_effect7 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

figure.ct_icon_effect7 img {
  max-width: 100%;
  backface-visibility: hidden;
}

figure.ct_icon_effect7 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.65);
}

figure.ct_icon_effect7 h3,
figure.ct_icon_effect7 .icons {
  width: 100%;
  position: absolute;
  margin: 5px 0;
  padding: 0;
}

figure.ct_icon_effect7 h3 {
  line-height: 1.1em;
  font-weight: 700;
  font-size: 1.4em;
  bottom: 50%;
  color: #fff;
}

figure.ct_icon_effect7 .icons {
  top: 50%;
  font-size: 0.7em;
  letter-spacing: 1px;
  font-weight: 300;
}

figure.ct_icon_effect7 .icons li {
  display: inline-block;
  -webkit-transform: translateY(40px);
  transform: translateY(40px);
  opacity: 0;
  list-style: none;
}

figure.ct_icon_effect7 a {
  padding: 0px 10px;
  color: #ffffff;
  text-decoration: none;
}

figure.ct_icon_effect7 a:hover {
  color: #f39c12;
}

figure.ct_icon_effect7:hover img,
figure.ct_icon_effect7.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}

figure.ct_icon_effect7:hover figcaption,
figure.ct_icon_effect7.hover figcaption {
  opacity: 1;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
}

figure.ct_icon_effect7:hover li,
figure.ct_icon_effect7.hover li {
  opacity: 1;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

figure.ct_icon_effect7:hover li:first-child,
figure.ct_icon_effect7.hover li:first-child {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

figure.ct_icon_effect7:hover li:nth-child(2),
figure.ct_icon_effect7.hover li:nth-child(2) {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

figure.ct_icon_effect7:hover li:nth-child(3),
figure.ct_icon_effect7.hover li:nth-child(3) {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

/****** ct_icon_effect8 ******/

.ct_icon_effect8 {
  font-family: 'Poppins', Arial, sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #000000;
  font-size: 16px;
  line-height: 1.2em;
  text-align: center;
  font-weight: 300;
}

.ct_icon_effect8 *,
.ct_icon_effect8 *:before,
.ct_icon_effect8 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.65s ease;
  transition: all 0.65s ease;
}

.ct_icon_effect8:after {
  -webkit-transition: all 0.65s ease;
  transition: all 0.65s ease;
  position: absolute;
  height: 0px;
  width: 0px;
  top: -478px;
  left: -478px;
  border-radius: 50%;
  border: 500px solid transparent;
  border-top-color: #000000;
  border-left-color: #000000;
  content: '';
  opacity: 0.8;
}

.ct_icon_effect8 img {
  max-width: 100%;
  vertical-align: top;
}

.ct_icon_effect8 i {
  position: absolute;
  top: -10px;
  left: -10px;
  border-radius: 50%;
  background: #fff;
  display: block;
  z-index: 10;
  width: 64px;
  height: 64px;
}

.ct_icon_effect8 i:before,
.ct_icon_effect8 i:after {
  border-radius: 50%;
}

.ct_icon_effect8 i:before {
  color: #ddd;
  background-color: #fff;
  font-size: 37.64705882px;
  line-height: 64px;
  text-align: center;
  width: 64px;
}

.ct_icon_effect8 i:after {
  position: absolute;
  top: -14px;
  bottom: -14px;
  left: -14px;
  right: -14px;
  border: 15px solid #ddd;
  border-top-color: #2980b9;
  border-left-color: #2980b9;
  content: '';
  z-index: -2;
  box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.5);
}

.ct_icon_effect8 i:hover {
  background-color: #fff;
  cursor: pointer;
}

.ct_icon_effect8 h3 {
  bottom: 0;
  color: #fff;
  letter-spacing: 2px;
  margin: 0;
  opacity: 0;
  padding: 10px 15px;
  position: absolute;
  right: 0;
  z-index: 3;
  font-size: 18.7px;
  line-height: 22px;
}

.ct_icon_effect8 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
}

.ct_icon_effect8:hover:after,
.ct_icon_effect8.hover:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.ct_icon_effect8:hover img,
.ct_icon_effect8.hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.ct_icon_effect8:hover i:before,
.ct_icon_effect8.hover i:before {
  color: #2980b9;
}

.ct_icon_effect8:hover i:after,
.ct_icon_effect8.hover i:after {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.ct_icon_effect8:hover h3,
.ct_icon_effect8.hover h3 {
  opacity: 1;
}

/****** ct_icon_effect9 ******/

.ct_icon_effect9 {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  color: #9e9e9e;
  display: inline-block;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  position: relative;
  text-align: center;
  width: 100%;
  background-color: #ffffff;
  border-radius: 5px;
  border-top: 5px solid #d2652d;
}

.ct_icon_effect9 *,
.ct_icon_effect9 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}

.ct_icon_effect9 img {
  max-width: 100%;
  vertical-align: top;
}

.ct_icon_effect9 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect9 h3 {
  color: #fff;
  font-size: 20px;
  font-weight: 300;
  line-height: 26px;
  background-color: #d2652d;
  margin: 0;
  padding: 0 0 6px;
}

.ct_icon_effect9 i {
  font-size: 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
  opacity: 0;
  color: #d2652d;
}

.ct_icon_effect9 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect9:hover img,
.ct_icon_effect9.hover img {
  opacity: 0.2;
}

.ct_icon_effect9:hover i,
.ct_icon_effect9.hover i {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 1;
}

/****** ct_icon_effect10 ******/

.ct_icon_effect10 {
  overflow: hidden;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  color: #000000;
  display:inline-block;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  position: relative;
  text-align: center;
  width: 100%;
  background-color: #ffffff;
}

.ct_icon_effect10 *,
.ct_icon_effect10 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}

.ct_icon_effect10 img {
  max-width: 100%;
  vertical-align: top;
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

.ct_icon_effect10 figcaption {
  position: absolute;
  top: 50%;
  width: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
}

.ct_icon_effect10 h3 {
  font-size: 20px;
  margin: 0;
  padding: 0 20px;
  text-transform: uppercase;
}

.ct_icon_effect10 i {
  font-size: 40px;
  position: absolute;
  bottom: 0%;
  right: -1px;
  -webkit-transform: translate(0%, 100%);
  transform: translate(0%, 100%);
  opacity: 0;
  line-height: 60px;
  width: 60px;
  color: #fff;
  background-color: #000000;
}

.ct_icon_effect10 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect10:hover figcaption,
.ct_icon_effect10.hover figcaption {
  opacity: 1;
}

.ct_icon_effect10:hover img,
.ct_icon_effect10.hover img {
  opacity: 0.2;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.ct_icon_effect10:hover i,
.ct_icon_effect10.hover i {
  -webkit-transform: translate(0%, 0%);
  transform: translate(0%, 0%);
  opacity: 1;
}

/****** ct_icon_effect11 ******/

figure.ct_icon_effect11 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
  -webkit-perspective: 50em;
  perspective: 50em;
}
figure.ct_icon_effect11 * {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
figure.ct_icon_effect11 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect11 figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  position: absolute;
  opacity: 0;
  z-index: 1;
  -webkit-transform: translate(-10%, -30%);
  transform: translate(-10%, -30%);
}
figure.ct_icon_effect11 h2,
figure.ct_icon_effect11 h4 {
  margin: 0;
}
figure.ct_icon_effect11 h2 {
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
}
figure.ct_icon_effect11 h4 {
  font-weight: 400;
  margin-top:10px;
}
figure.ct_icon_effect11 i {
  font-size: 50px;
}
figure.ct_icon_effect11:after {
  background-color: #ffffff;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: rotate3d(-1, -1, 0, 100deg);
  transform: rotate3d(-1, -1, 0, 100deg);
  opacity: 0;
}
figure.ct_icon_effect11 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect11:hover figcaption,
figure.ct_icon_effect11.hover figcaption {
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect11:hover:after,
figure.ct_icon_effect11.hover:after {
  -webkit-transform: rotate3d(0, 0, 0, 0deg);
  transform: rotate3d(0, 0, 0, 0deg);
  opacity: 0.9;
}

/****** ct_icon_effect12 ******/

figure.ct_icon_effect12 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  color: #ffffff;
  height:269px;
}
figure.ct_icon_effect12 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
figure.ct_icon_effect12 img {
  opacity: 0.8;
  width: 100%;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}
figure.ct_icon_effect12 figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
figure.ct_icon_effect12 figcaption > div {
  height: 50%;
  overflow: hidden;
  width: 100%;
  position: relative;
}
figure.ct_icon_effect12 h2,
figure.ct_icon_effect12 h3,
figure.ct_icon_effect12 .icons {
  margin: 0;
  position: absolute;
  right: 0;
  padding: 0 30px;
  color: #fff;
  text-align: right;
}
figure.ct_icon_effect12 h2 {
  font-weight: 900;
  font-size: 24px;
  line-height: 24px;
  bottom: 0;
}
figure.ct_icon_effect12 h3 {
  font-size: 13px;
  line-height: 15px;
  top: 5px;
  font-weight: 500;
}
figure.ct_icon_effect12 .icons {
  opacity: 0;
  -webkit-transform: translateY(-150%);
  transform: translateY(-150%);
}
figure.ct_icon_effect12 .icons a {
  color: #ffffff;
  text-decoration: none;
  padding: 5px;
  font-size: 1.6em;
  opacity: 0.6;
}
figure.ct_icon_effect12 .icons a:hover {
  opacity: 1;
  cursor: pointer;
}
figure.ct_icon_effect12:hover img,
figure.ct_icon_effect12.hover img {
  opacity: 0.3;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
figure.ct_icon_effect12:hover figcaption h3,
figure.ct_icon_effect12.hover figcaption h3 {
  -webkit-transform: translateY(-150%);
  transform: translateY(-150%);
  opacity: 0;
}
figure.ct_icon_effect12:hover figcaption .icons,
figure.ct_icon_effect12.hover figcaption .icons {
  opacity: 1;
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
}

/****** ct_icon_effect13 ******/

.ct_icon_effect13 {
  font-family: 'Muli', sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  background-color: #000000;
}

.ct_icon_effect13 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.45s ease;
  transition: all 0.45s ease;
}

.ct_icon_effect13 img {
  vertical-align: top;
  max-width: 100%;
  backface-visibility: hidden;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.75;
}

.ct_icon_effect13 figcaption {
  z-index: 1;
  align-items: center;
  position: absolute;
  width: 100%;
  top: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: rgba(195, 86, 97, 0.85);
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.2) 0%, transparent 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.2) 0%, transparent 100%);
  padding: 20px;
}

.ct_icon_effect13 figcaption:before {
  content: '';
  width: 20px;
  height: 20px;
  background-color: #fff;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 50%) rotate(45deg);
  transform: translate(-50%, 50%) rotate(45deg);
  position: absolute;
}

.ct_icon_effect13 h3,
.ct_icon_effect13 h5 {
  margin: 0;
  letter-spacing: 1px;
  color: #fff;
}

.ct_icon_effect13 h3 {
  font-family: 'Montserrat', sans-serif;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 22px;
  font-size: 18.7px;
}

.ct_icon_effect13 h5 {
  font-weight: normal;
  font-size: 13px;
  line-height: 24px;
}

.ct_icon_effect13 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect13:hover > img,
.ct_icon_effect13.hover > img {
  opacity: 1;
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
}

/****** ct_icon_effect14 ******/

.ct_icon_effect14 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  color: #ffffff;
  text-align: center;
  font-size: 16px;
  background-color: #ad4334;
}
.ct_icon_effect14 *,
.ct_icon_effect14 *:before,
.ct_icon_effect14 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.55s ease;
  transition: all 0.55s ease;
}
.ct_icon_effect14:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.2) 0%, transparent 100%);
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.2) 0%, transparent 100%);
  content: '';
}
.ct_icon_effect14 .image {
  border: 20px solid #863428;
  overflow: hidden;
}
.ct_icon_effect14 .image:after {
  position: absolute;
  top: 40px;
  bottom: 40px;
  left: 40px;
  right: 40px;
  background-color: #9a3c2e;
  content: '';
}
.ct_icon_effect14 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
  -webkit-filter: grayscale(40%);
  filter: grayscale(40%);
  opacity: 0.9;
}
.ct_icon_effect14 figcaption {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  padding: 5px 10px 10px;
}
.ct_icon_effect14 h2,
.ct_icon_effect14 h3 {
  margin: 0;
  line-height: 1em;
  color: #fff;
}
.ct_icon_effect14 h2 {
  font-family: 'Sacramento', Arial, sans-serif;
  font-size: 2.5em;
  font-weight: 400;
}
.ct_icon_effect14 h3 {
  text-transform: uppercase;
  opacity: 0.6;
  font-weight: 300;
  font-size: 1.6em;
}
.ct_icon_effect14 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.ct_icon_effect14:hover img,
.ct_icon_effect14.hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

/****** ct_icon_effect15 ******/

figure.ct_icon_effect15 {
  position: relative;
  float: left;
  overflow: hidden;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
figure.ct_icon_effect15 *,
figure.ct_icon_effect15 *:before,
figure.ct_icon_effect15 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
figure.ct_icon_effect15 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
figure.ct_icon_effect15 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
figure.ct_icon_effect15 figcaption:before,
figure.ct_icon_effect15 figcaption:after,
figure.ct_icon_effect15 figcaption div:before,
figure.ct_icon_effect15 figcaption div:after {
  opacity: 0;
}
figure.ct_icon_effect15 figcaption:before,
figure.ct_icon_effect15 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
}
figure.ct_icon_effect15 figcaption:before {
  top: 0;
  left: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
figure.ct_icon_effect15 figcaption:after {
  bottom: 0;
  right: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.ct_icon_effect15 figcaption div:before,
figure.ct_icon_effect15 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
}
figure.ct_icon_effect15 figcaption div:before {
  top: 0;
  right: 0;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
figure.ct_icon_effect15 figcaption div:after {
  bottom: 0;
  left: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
figure.ct_icon_effect15 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}
figure.ct_icon_effect15 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
figure.ct_icon_effect15:hover img,
figure.ct_icon_effect15.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
figure.ct_icon_effect15:hover i,
figure.ct_icon_effect15.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect15:hover figcaption:before,
figure.ct_icon_effect15.hover figcaption:before,
figure.ct_icon_effect15:hover figcaption:after,
figure.ct_icon_effect15.hover figcaption:after,
figure.ct_icon_effect15:hover figcaption div:before,
figure.ct_icon_effect15.hover figcaption div:before,
figure.ct_icon_effect15:hover figcaption div:after,
figure.ct_icon_effect15.hover figcaption div:after {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 0.8;
}

/****** ct_icon_effect16 ******/

figure.ct_icon_effect16 {
  position: relative;
  float: left;
  overflow: hidden;
  border: 4px solid #222222;
  width: 100%;
  background: #222222;
  text-align: center;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect16 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect16 img {
  max-width: 100%;
  opacity: 1.0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s linear;
  transition: .3s linear;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}
figure.ct_icon_effect16 > div a {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  color: #ffffff;
}
figure.ct_icon_effect16 > div a i {
  display: inline-block;
  font-size: 58px;
  opacity: 0;
  top: 55%;
  position: relative;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.ct_icon_effect16:hover img {
  opacity: 0.3;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.ct_icon_effect16:hover > div i {
  opacity: 0.8;
  top: 50%;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}

/****** ct_icon_effect17 ******/

figure.ct_icon_effect17 {
  position: relative;
  float: left;
  overflow: hidden;
  border: 4px solid #222222;
  width: 100%;
  background: #222222;
  text-align: center;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect17 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect17 img {
  max-width: 100%;
  opacity: 1.0;
  -webkit-transition: opacity 0.35s, scale(1);
  transition: opacity 0.35s, scale(1);
  -webkit-transition: .3s linear;
  transition: .3s linear;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}
figure.ct_icon_effect17 > div a {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  color: #ffffff;
}
figure.ct_icon_effect17 > div a i {
  display: inline-block;
  font-size: 58px;
  opacity: 0;
  top: 55%;
  position: relative;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.ct_icon_effect17 > div::before {
  position: absolute;
  top: 30px;
  right: 30px;
  bottom: 30px;
  left: 30px;
  border: 2px solid rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 0 30px #222222;
  content: '';
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: scale3d(1.5, 1.5, 1);
  transform: scale3d(1.5, 1.5, 1);
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}
figure.ct_icon_effect17:hover img {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  opacity: 0.3;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.ct_icon_effect17:hover > div i {
  opacity: 0.8;
  top: 50%;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}
figure.ct_icon_effect17:hover > div::before {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

/****** ct_icon_effect18 ******/

figure.ct_icon_effect18 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #222222;
  text-align: center;
}
figure.ct_icon_effect18 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect18 img {
  position: relative;
  width: 100%;
  top: 0;
  opacity: 1.0;
  right: 0;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
figure.ct_icon_effect18 > div {
  width: 100%;
  bottom: -70px;
  position: absolute;
  padding: 4px;
  color: #ffffff;
  border-top: 4px solid #ffffff;
  background: #222222;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
figure.ct_icon_effect18 > div a i {
  display: inline-block;
  font-size: 32px;
  color: #ffffff;
  padding: 8px 15px;
  position: relative;
  bottom: -60px;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
figure.ct_icon_effect18 > div a i:hover {
  color: #fff;
}
figure.ct_icon_effect18:hover img {
  opacity: 0.5;
  top: -60px;
}
figure.ct_icon_effect18:hover > div {
  bottom: 0;
  opacity: 1;
}
figure.ct_icon_effect18:hover > div a i {
  bottom: 0;
}
figure.ct_icon_effect18:hover a:first-child i {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
figure.ct_icon_effect18:hover a:nth-child(2) i {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}
figure.ct_icon_effect18:hover a:nth-child(3) i {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

/****** ct_icon_effect19 ******/

figure.ct_icon_effect19 {
  position: relative;
  float: left;
  overflow: hidden;
  background: #000000;
  cursor: pointer;
}
figure.ct_icon_effect19 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
figure.ct_icon_effect19 img {
  max-width: 100%;
  position: relative;
  top: 0;
  opacity: 1.0;
  right: 0;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
figure.ct_icon_effect19 > div {
  opacity: 0;
  width: 100%;
  height: 100%;
  bottom: 0px;
  position: absolute;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
figure.ct_icon_effect19 > div::after {
  content: '';
  position: absolute;
  width: 200px;
  height: 150px;
  background-color: #000000;
  opacity: 0;
  bottom: -58px;
  left: -84px;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  -webkit-transform: rotate(45deg) translate3d(-100%, 0%, 0);
  transform: rotate(45deg) translate3d(-100%, 0%, 0);
}
figure.ct_icon_effect19 > div::before {
  content: '';
  position: absolute;
  width: 350px;
  height: 70px;
  opacity: 0;
  border-top: 2px solid #ffffff;
  background-color: #000000;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  bottom: 60px;
  left: -85px;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  -webkit-transform: rotate(45deg) translate3d(100%, 0%, 0);
  transform: rotate(45deg) translate3d(100%, 0%, 0);
}
figure.ct_icon_effect19 > div a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
figure.ct_icon_effect19 > div i {
  color: #fff;
}
figure.ct_icon_effect19 > div i:before {
  display: inline-block;
  font-size: 60px;
  left: 0;
  bottom: 0;
  opacity: 0;
  padding: 50px;
  position: absolute;
  -webkit-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  z-index: 1;
}
figure.ct_icon_effect19:hover img {
  opacity: 0.5;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
figure.ct_icon_effect19:hover > div {
  bottom: 0;
  opacity: 1;
}
figure.ct_icon_effect19:hover > div::after,
figure.ct_icon_effect19:hover > div::before {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
figure.ct_icon_effect19:hover > div::after {
  -webkit-transform: rotate(45deg) translate3d(0, 0, 0);
  transform: rotate(45deg) translate3d(0, 0, 0);
  opacity: 1;
}
figure.ct_icon_effect19:hover > div::before {
  -webkit-transform: rotate(45deg) translate3d(0, 0, 0);
  transform: rotate(45deg) translate3d(0, 0, 0);
  opacity: 1;
}
figure.ct_icon_effect19:hover > div i::before {
  opacity: 1;
  -webkit-transition-delay: .3s;
  transition-delay: .3s;
}

/****** ct_icon_effect20 ******/

figure.ct_icon_effect20 {
  position: relative;
  float: left;
  overflow: hidden;
  background: #000000;
  text-align: center;
  cursor: pointer;
}
figure.ct_icon_effect20 img {
  max-width: 100%;
  opacity: 1;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}
figure.ct_icon_effect20 > div a {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  color: #ffffff;
}
figure.ct_icon_effect20 > div a i::before {
  font-size: 50px;
  opacity: 0;
  top: 55%;
  position: relative;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  -webkit-transform: translate3d(0, -50%, 0);
  transform: translate3d(0, -50%, 0);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  display: inline-block;
}
figure.ct_icon_effect20 > div::before {
  position: absolute;
  top: 40%;
  right: 50%;
  bottom: 40%;
  left: 50%;
  border-left: 1px solid rgba(255, 255, 255, 0.8);
  border-right: 1px solid rgba(255, 255, 255, 0.8);
  content: '';
  opacity: 0;
  background-color: #ffffff;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
figure.ct_icon_effect20:hover img {
  opacity: 0.35;
}
figure.ct_icon_effect20:hover > div i::before {
  opacity: 0.9;
  top: 50%;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
figure.ct_icon_effect20:hover > div::before {
  background: rgba(255, 255, 255, 0);
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
  opacity: 1;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

/****** ct_icon_effect21_right ******/

.ct_icon_effect21_right {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.ct_icon_effect21_right *,
.ct_icon_effect21_right *:before,
.ct_icon_effect21_right *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.ct_icon_effect21_right img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
.ct_icon_effect21_right figcaption {
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 20px;
  right: 20px;
  background-color: #009ab6;
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
  opacity: 0;
}
.ct_icon_effect21_right i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
}
.ct_icon_effect21_right a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.ct_icon_effect21_right:hover figcaption,
.ct_icon_effect21_right.hover figcaption {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}


/****** ct_icon_effect21_left ******/

.ct_icon_effect21_left {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.ct_icon_effect21_left *,
.ct_icon_effect21_left *:before,
.ct_icon_effect21_left *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.ct_icon_effect21_left img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
.ct_icon_effect21_left figcaption {
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 20px;
  right: 20px;
  background-color: #009ab6;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}
.ct_icon_effect21_left i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
}
.ct_icon_effect21_left a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.ct_icon_effect21_left:hover figcaption,
.ct_icon_effect21_left.hover figcaption {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/****** ct_icon_effect22 ******/

.ct_icon_effect22 {
  font-family: 'Lato', Arial, sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  background-color: #ffffff;
  color: #2B2B2B;
  text-align: center;
  font-size: 16px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}

.ct_icon_effect22 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ct_icon_effect22 .profile-image {
  padding: 15% 10% 0;
}

.ct_icon_effect22 .profile-image img {
  max-width: 100%;
  vertical-align: top;
  position: relative;
  border-radius: 50%;
  width: 100px;
  height: 100px;
}

.ct_icon_effect22 figcaption {
  padding: 5% 10% 15%;
}

.ct_icon_effect22 h3 {
  font-family: 'Oswald';
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 400;
  line-height: 24px;
  margin: 3px 0;
}

.ct_icon_effect22 h5 {
  font-weight: 400;
  margin: 0;
  text-transform: uppercase;
  color: #888;
  letter-spacing: 1px;
}

.ct_icon_effect22 .icons i {
  color: #999;
  display: inline-block;
  margin-right: 5px;
  font-size: 1.5em;
}

.ct_icon_effect22 .icons i:hover {
  color: #555;
}

.ct_icon_effect22 .icons i a {
  text-decoration: none;
}

/****** ct_icon_effect23 ******/

.ct_icon_effect23 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  font-size: 16px;
  line-height: 1.2em;
}
.ct_icon_effect23 *,
.ct_icon_effect23 *:before,
.ct_icon_effect23 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect23:before {
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
  content: '';
  background-color: #ffffff;
  opacity: 0;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect23 img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect23 .icons {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ct_icon_effect23 a {
  margin: 2px;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}
.ct_icon_effect23 a i {
  display: block;
  font-size: 23.52941176px;
  line-height: 40px;
  width: 40px;
  background-color: #ffffff;
  text-align: center;
  color: #000000;
}
.ct_icon_effect23 a i:hover {
  background-color: #000000;
  color: #ffffff;
  cursor: pointer;
}
.ct_icon_effect23:hover:before,
.ct_icon_effect23.hover:before {
  opacity: 0.5;
}
.ct_icon_effect23:hover a,
.ct_icon_effect23.hover a {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.ct_icon_effect23:hover a:nth-child(2),
.ct_icon_effect23.hover a:nth-child(2) {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}
.ct_icon_effect23:hover a:nth-child(3),
.ct_icon_effect23.hover a:nth-child(3) {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

/****** ct_icon_effect24 ******/

.ct_icon_effect24 {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.ct_icon_effect24 *,
.ct_icon_effect24 *:before,
.ct_icon_effect24 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.ct_icon_effect24 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}

.ct_icon_effect24 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect24 figcaption:before,
.ct_icon_effect24 figcaption:after,
.ct_icon_effect24 figcaption div:before,
.ct_icon_effect24 figcaption div:after {
  opacity: 0;
}

.ct_icon_effect24 figcaption:before,
.ct_icon_effect24 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.ct_icon_effect24 figcaption:before {
  top: 0;
  left: 0;
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

.ct_icon_effect24 figcaption:after {
  bottom: 0;
  right: 0;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}

.ct_icon_effect24 figcaption div:before,
.ct_icon_effect24 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.ct_icon_effect24 figcaption div:before {
  top: 0;
  right: 0;
  -webkit-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  transform-origin: 0 100%;
}

.ct_icon_effect24 figcaption div:after {
  bottom: 0;
  left: 0;
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}

.ct_icon_effect24 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}

.ct_icon_effect24 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect24:hover img,
.ct_icon_effect24.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}

.ct_icon_effect24:hover i,
.ct_icon_effect24.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.ct_icon_effect24:hover figcaption:before,
.ct_icon_effect24.hover figcaption:before,
.ct_icon_effect24:hover figcaption:after,
.ct_icon_effect24.hover figcaption:after,
.ct_icon_effect24:hover figcaption div:before,
.ct_icon_effect24.hover figcaption div:before,
.ct_icon_effect24:hover figcaption div:after,
.ct_icon_effect24.hover figcaption div:after {
  -webkit-transform: rotate(0);
  transform: rotate(0);
  opacity: 0.8;
}

/****** ct_icon_effect25 ******/

.ct_icon_effect25 {
  font-family: 'Open Sans', Arial, sans-serif;
  position: relative;
  float: left;
  width: 100%;
  color: #000000;
  text-align: center;
  line-height: 1.4em;
  font-size: 14px;
  box-shadow: none !important;
}

.ct_icon_effect25 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ct_icon_effect25 .profile-image {
  display: inline-block;
  width: 80%;
  z-index: 1;
  position: relative;
  padding: 10px;
  border: 2px solid #e8b563;
}

.ct_icon_effect25 .profile-image img {
  max-width: 100%;
  vertical-align: top;
}

.ct_icon_effect25 figcaption {
  width: 100%;
  background-color: #F2F2F2;
  color: #555;
  padding: 125px 25px 25px;
  margin-top: -100px;
  display: inline-block;
}

.ct_icon_effect25 h3,
.ct_icon_effect25 h4,
.ct_icon_effect25 p {
  margin: 0 0 5px;
}

.ct_icon_effect25 h3 {
  font-weight: 600;
  font-size: 1.3em;
  font-family: 'Playfair Display', Arial, sans-serif;
}

.ct_icon_effect25 h4 {
  color: #8c8c8c;
  font-weight: 400;
  letter-spacing: 2px;
}

.ct_icon_effect25 p {
  font-size: 0.9em;
  letter-spacing: 1px;
  opacity: 0.9;
}

.ct_icon_effect25 .icons {
  text-align: center;
  width: 100%;
}

.ct_icon_effect25 i {
  padding: 10px 2px;
  display: inline-block;
  font-size: 18px;
  font-weight: normal;
  color: #e8b563;
  opacity: 0.75;
}

.ct_icon_effect25 i:hover {
  opacity: 1;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

/****** ct_icon_effect26 ******/

.ct_icon_effect26 {
  background-color: #000000;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  color: #ffffff;
  display:inline-block;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6em;
  overflow: hidden;
  position: relative;
  text-align: left;
  width: 100%;
}

.ct_icon_effect26 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

.ct_icon_effect26 img {
  max-width: 100%;
  opacity: 0.75;
  position: relative;
  vertical-align: top;
}

.ct_icon_effect26 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect26 h3 {
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  background-color: #000000;
  bottom: 0;
  font-weight: 800;
  letter-spacing: -0.4px;
  margin: 0;
  padding: 10px 20px;
  position: absolute;
  width: 100%;
  color: #fff;
}

.ct_icon_effect26 p {
  padding: 15px 20px;
  opacity: 0;
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

.ct_icon_effect26 i {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 54px;
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
}

.ct_icon_effect26 .hover {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  align-items: center;
  background-color: rgba(236, 188, 46, 0.75);
  display: flex;
  font-size: 65px;
  justify-content: center;
  opacity: 0;
}

.ct_icon_effect26 a {
  left: 0;
  bottom: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

.ct_icon_effect26:hover .hover,
.ct_icon_effect26.hover .hover {
  opacity: 1;
}

.ct_icon_effect26:hover p,
.ct_icon_effect26.hover p {
  opacity: 1;
}

.ct_icon_effect26:hover h3,
.ct_icon_effect26.hover h3 {
  -webkit-transform: translateY(0%);
  transform: translateY(0%);
}

.ct_icon_effect26:hover i,
.ct_icon_effect26.hover i {
  -webkit-transform: translate(-50%, -50%) scale(0.1);
  transform: translate(-50%, -50%) scale(0.1);
  opacity: 0;
}

/****** ct_icon_effect27 ******/

.ct_icon_effect27 {
  font-family: 'Roboto', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background-color: #ffffff;
  border-radius: 5px;
  border-top: 5px solid #d2652d;
  color: #9e9e9e;
  text-align: center;
  font-size: 16px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}

.ct_icon_effect27 *,
.ct_icon_effect27 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}

.ct_icon_effect27 figcaption {
  padding: 12% 10% 14%;
}

.ct_icon_effect27 i {
  font-size: 54px;
  color: #fff;
  width: 80px;
  line-height: 80px;
  background-color: #d2652d;
  border-radius: 50%;
  padding: 0;
  margin: 0 0 10px;
  text-align: center;
  display: inline-block;
}

.ct_icon_effect27 h3 {
  color: #3c3c3c;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin: 10px 0;
}

.ct_icon_effect27 p {
  font-size: 0.9em;
  font-weight: 300;
  margin: 0 0 20px;
}

.ct_icon_effect27 .button {
  text-decoration: none;
  color: #777;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  padding: 5px 10px;
  display: inline-block;
  position: relative;
  z-index: 1;
}

.ct_icon_effect27 .button:before {
  background-color: #d2652d;
  position: absolute;
  top: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  content: '';
  z-index: -1;
  opacity: 0;
}

.ct_icon_effect27 .button:hover {
  color: #fff;
}

.ct_icon_effect27 .button:hover:before {
  top: 0;
  opacity: 1;
}

/****** ct_icon_effect28 ******/

.ct_icon_effect28 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.ct_icon_effect28 *,
.ct_icon_effect28 *:before,
.ct_icon_effect28 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.ct_icon_effect28 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}

.ct_icon_effect28 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect28 figcaption:before,
.ct_icon_effect28 figcaption:after,
.ct_icon_effect28 figcaption div:before,
.ct_icon_effect28 figcaption div:after {
  opacity: 0;
}

.ct_icon_effect28 figcaption:before,
.ct_icon_effect28 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
}

.ct_icon_effect28 figcaption:before {
  top: 0;
  left: 0;
  -webkit-transform: translate(-100%, -100%);
  transform: translate(-100%, -100%);
}

.ct_icon_effect28 figcaption:after {
  bottom: 0;
  right: 0;
  -webkit-transform: translate(100%, 100%);
  transform: translate(100%, 100%);
}

.ct_icon_effect28 figcaption div:before,
.ct_icon_effect28 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
}

.ct_icon_effect28 figcaption div:before {
  top: 0;
  right: 0;
  -webkit-transform: translate(100%, -100%);
  transform: translate(100%, -100%);
}

.ct_icon_effect28 figcaption div:after {
  bottom: 0;
  left: 0;
  -webkit-transform: translate(-100%, 100%);
  transform: translate(-100%, 100%);
}

.ct_icon_effect28 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}

.ct_icon_effect28 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect28:hover img,
.ct_icon_effect28.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}

.ct_icon_effect28:hover i,
.ct_icon_effect28.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.ct_icon_effect28:hover figcaption:before,
.ct_icon_effect28.hover figcaption:before,
.ct_icon_effect28:hover figcaption:after,
.ct_icon_effect28.hover figcaption:after,
.ct_icon_effect28:hover figcaption div:before,
.ct_icon_effect28.hover figcaption div:before,
.ct_icon_effect28:hover figcaption div:after,
.ct_icon_effect28.hover figcaption div:after {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 0.8;
}

/****** ct_icon_effect29 ******/

.ct_icon_effect29 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  border: 3px solid #34495e;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.ct_icon_effect29 *,
.ct_icon_effect29 *:before,
.ct_icon_effect29 *:after {
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.ct_icon_effect29 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}

.ct_icon_effect29 i {
  position: absolute;
  line-height: 50px;
  width: 50px;
  text-align: center;
  font-size: 28px;
  z-index: 1;
  bottom: 0;
  left: 0;
  -webkit-transform: translate(-100%, 100%);
  transform: translate(-100%, 100%);
}

.ct_icon_effect29 i:after {
  position: absolute;
  bottom: 3px;
  left: 3px;
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 75px 0 0 75px;
  border-color: transparent transparent transparent #34495e;
  z-index: -1;
}

.ct_icon_effect29 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect29:hover img,
.ct_icon_effect29.hover img {
  zoom: 1;
  filter: alpha(opacity=70);
  -webkit-opacity: 0.7;
  opacity: 0.7;
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

.ct_icon_effect29:hover i,
.ct_icon_effect29.hover i {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

/****** ct_icon_effect30 ******/

.ct_icon_effect30 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.ct_icon_effect30 *,
.ct_icon_effect30 *:before,
.ct_icon_effect30 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.ct_icon_effect30 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
.ct_icon_effect30 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.ct_icon_effect30 figcaption:before,
.ct_icon_effect30 figcaption:after,
.ct_icon_effect30 figcaption div:before,
.ct_icon_effect30 figcaption div:after {
  opacity: 0;
  -webkit-transform: scale(0.05);
  transform: scale(0.05);
}
.ct_icon_effect30 figcaption:before,
.ct_icon_effect30 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
}
.ct_icon_effect30 figcaption:before {
  top: 0;
  left: 0;
}
.ct_icon_effect30 figcaption:after {
  bottom: 0;
  right: 0;
}
.ct_icon_effect30 figcaption div:before,
.ct_icon_effect30 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
}
.ct_icon_effect30 figcaption div:before {
  top: 0;
  right: 0;
}
.ct_icon_effect30 figcaption div:after {
  bottom: 0;
  left: 0;
}
.ct_icon_effect30 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}
.ct_icon_effect30 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.ct_icon_effect30:hover img,
.ct_icon_effect30.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
.ct_icon_effect30:hover i,
.ct_icon_effect30.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
.ct_icon_effect30:hover figcaption:before,
.ct_icon_effect30.hover figcaption:before,
.ct_icon_effect30:hover figcaption:after,
.ct_icon_effect30.hover figcaption:after,
.ct_icon_effect30:hover figcaption div:before,
.ct_icon_effect30.hover figcaption div:before,
.ct_icon_effect30:hover figcaption div:after,
.ct_icon_effect30.hover figcaption div:after {
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 0.8;
}
.ct_icon_effect30:hover figcaption:before,
.ct_icon_effect30.hover figcaption:before {
  -webkit-transition-delay: 0;
  transition-delay: 0;
}
.ct_icon_effect30:hover figcaption:after,
.ct_icon_effect30.hover figcaption:after {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
.ct_icon_effect30:hover figcaption div:before,
.ct_icon_effect30.hover figcaption div:before {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
.ct_icon_effect30:hover figcaption div:after,
.ct_icon_effect30.hover figcaption div:after {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

/****** ct_icon_effect31 ******/

.ct_icon_effect31 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.ct_icon_effect31 *,
.ct_icon_effect31 *:before,
.ct_icon_effect31 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.ct_icon_effect31 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}

.ct_icon_effect31 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect31 figcaption:before,
.ct_icon_effect31 figcaption:after,
.ct_icon_effect31 figcaption div:before,
.ct_icon_effect31 figcaption div:after {
  opacity: 0;
}

.ct_icon_effect31 figcaption:before,
.ct_icon_effect31 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
}

.ct_icon_effect31 figcaption:before {
  top: 0;
  left: 0;
  -webkit-transform: translate(100%, 100%);
  transform: translate(100%, 100%);
}

.ct_icon_effect31 figcaption:after {
  bottom: 0;
  right: 0;
  -webkit-transform: translate(-100%, -100%);
  transform: translate(-100%, -100%);
}

.ct_icon_effect31 figcaption div:before,
.ct_icon_effect31 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
}

.ct_icon_effect31 figcaption div:before {
  top: 0;
  right: 0;
  -webkit-transform: translate(-100%, 100%);
  transform: translate(-100%, 100%);
}

.ct_icon_effect31 figcaption div:after {
  bottom: 0;
  left: 0;
  -webkit-transform: translate(100%, -100%);
  transform: translate(100%, -100%);
}

.ct_icon_effect31 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}

.ct_icon_effect31 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.ct_icon_effect31:hover img,
.ct_icon_effect31.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}

.ct_icon_effect31:hover i,
.ct_icon_effect31.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.ct_icon_effect31:hover figcaption:before,
.ct_icon_effect31.hover figcaption:before,
.ct_icon_effect31:hover figcaption:after,
.ct_icon_effect31.hover figcaption:after,
.ct_icon_effect31:hover figcaption div:before,
.ct_icon_effect31.hover figcaption div:before,
.ct_icon_effect31:hover figcaption div:after,
.ct_icon_effect31.hover figcaption div:after {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 0.8;
}

/****** ct_icon_effect32 ******/

figure.ct_icon_effect32 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  font-size: 16px;
  background-color: #000000;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
figure.ct_icon_effect32 *,
figure.ct_icon_effect32 *:before,
figure.ct_icon_effect32 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
figure.ct_icon_effect32 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
figure.ct_icon_effect32 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
figure.ct_icon_effect32 figcaption:before,
figure.ct_icon_effect32 figcaption:after,
figure.ct_icon_effect32 figcaption div:before,
figure.ct_icon_effect32 figcaption div:after {
  opacity: 0;
}
figure.ct_icon_effect32 figcaption:before,
figure.ct_icon_effect32 figcaption:after {
  height: 50%;
  width: 50%;
  position: absolute;
  content: '';
  background-color: #080808;
}
figure.ct_icon_effect32 figcaption:before {
  top: 0;
  left: 0;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}
figure.ct_icon_effect32 figcaption:after {
  bottom: 0;
  right: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
figure.ct_icon_effect32 figcaption div:before,
figure.ct_icon_effect32 figcaption div:after {
  width: 50%;
  height: 50%;
  position: absolute;
  content: '';
  background-color: #000000;
}
figure.ct_icon_effect32 figcaption div:before {
  top: 0;
  right: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.ct_icon_effect32 figcaption div:after {
  bottom: 0;
  left: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
figure.ct_icon_effect32 i {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 4em;
  z-index: 1;
  opacity: 0;
}
figure.ct_icon_effect32 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
figure.ct_icon_effect32:hover img,
figure.ct_icon_effect32.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
figure.ct_icon_effect32:hover i,
figure.ct_icon_effect32.hover i {
  opacity: 0.7;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect32:hover figcaption:before,
figure.ct_icon_effect32.hover figcaption:before,
figure.ct_icon_effect32:hover figcaption:after,
figure.ct_icon_effect32.hover figcaption:after,
figure.ct_icon_effect32:hover figcaption div:before,
figure.ct_icon_effect32.hover figcaption div:before,
figure.ct_icon_effect32:hover figcaption div:after,
figure.ct_icon_effect32.hover figcaption div:after {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 0.8;
}

/****** ct_icon_effect33 ******/

figure.ct_icon_effect33 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  background-color: #000000;
}
figure.ct_icon_effect33 *,
figure.ct_icon_effect33 *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
figure.ct_icon_effect33 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
figure.ct_icon_effect33:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  content: '';
  background-color: rgba(0, 0, 0, 0.65);
  z-index: 1;
  opacity: 0;
}
figure.ct_icon_effect33 i {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 48px;
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
  opacity: 0;
  z-index: 2;
}
figure.ct_icon_effect33 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
}
figure.ct_icon_effect33:hover img,
figure.ct_icon_effect33.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
figure.ct_icon_effect33:hover:after,
figure.ct_icon_effect33.hover:after {
  opacity: 1;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
}
figure.ct_icon_effect33:hover i,
figure.ct_icon_effect33.hover i {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0.8;
}


/****** ct_icon_effect34_right ******/

figure.ct_icon_effect34_right {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
  -webkit-perspective: 50em;
  perspective: 50em;
}
figure.ct_icon_effect34_right * {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
figure.ct_icon_effect34_right img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect34_right figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  position: absolute;
  opacity: 0;
  z-index: 1;
  -webkit-transform: translate(-10%, -50%);
  transform: translate(-10%, -50%);
}
figure.ct_icon_effect34_right h2,
figure.ct_icon_effect34_right h4 {
  margin: 0;
}
figure.ct_icon_effect34_right h2 {
  font-weight: 600;
  font-size: 24px;
  line-height: 24px;
}
figure.ct_icon_effect34_right h4 {
  font-weight: 400;
  text-transform: uppercase;
}
figure.ct_icon_effect34_right i {
  font-size: 32px;
}
figure.ct_icon_effect34_right:after {
  background-color: #ffffff;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
  opacity: 0;
}
figure.ct_icon_effect34_right a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect34_right:hover figcaption,
figure.ct_icon_effect34_right.hover figcaption {
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect34_right:hover:after,
figure.ct_icon_effect34_right.hover:after {
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  opacity: 0.9;
}

/****** ct_icon_effect34_left ******/

figure.ct_icon_effect34_left {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
  -webkit-perspective: 50em;
  perspective: 50em;
}
figure.ct_icon_effect34_left * {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
figure.ct_icon_effect34_left img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect34_left figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  position: absolute;
  opacity: 0;
  z-index: 1;
  -webkit-transform: translate(10%, -50%);
  transform: translate(10%, -50%);
}
figure.ct_icon_effect34_left h2,
figure.ct_icon_effect34_left h4 {
  margin: 0;
}
figure.ct_icon_effect34_left h2 {
  font-weight: 600;
  font-size: 24px;
  line-height: 24px;
}
figure.ct_icon_effect34_left h4 {
  font-weight: 400;
  text-transform: uppercase;
}
figure.ct_icon_effect34_left i {
  font-size: 32px;
}
figure.ct_icon_effect34_left:after {
  background-color: #ffffff;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: rotateY(90deg);
  transform: rotateY(90deg);
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  opacity: 0;
}
figure.ct_icon_effect34_left a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect34_left:hover figcaption,
figure.ct_icon_effect34_left.hover figcaption {
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect34_left:hover:after,
figure.ct_icon_effect34_left.hover:after {
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  opacity: 0.9;
}

/****** ct_icon_effect35 ******/

figure.ct_icon_effect35 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  background-color: #000000;
}
figure.ct_icon_effect35 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
figure.ct_icon_effect35 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
}
figure.ct_icon_effect35:after,
figure.ct_icon_effect35 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
figure.ct_icon_effect35:after {
  content: '';
  background-color: rgba(0, 0, 0, 0.65);
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  opacity: 0;
}
figure.ct_icon_effect35 figcaption {
  z-index: 1;
  padding: 40px;
}
figure.ct_icon_effect35 h3,
figure.ct_icon_effect35 .links {
  width: 100%;
  margin: 5px 0;
  padding: 0;
}
figure.ct_icon_effect35 h3 {
  line-height: 1.1em;
  font-weight: 700;
  font-size: 1.4em;
  opacity: 0;
  color: #fff;
}
figure.ct_icon_effect35 p {
  font-size: 0.8em;
  font-weight: 300;
  letter-spacing: 1px;
  opacity: 0;
  top: 50%;
  -webkit-transform: translateY(40px);
  transform: translateY(40px);
}
figure.ct_icon_effect35 i {
  position: absolute;
  bottom: 10px;
  right: 10px;
  padding: 20px 25px;
  font-size: 34px;
  opacity: 0;
  -webkit-transform: translateX(-10px);
  transform: translateX(-10px);
}
figure.ct_icon_effect35 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
figure.ct_icon_effect35:hover img,
figure.ct_icon_effect35.hover img {
  zoom: 1;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.5;
  opacity: 0.5;
}
figure.ct_icon_effect35:hover:after,
figure.ct_icon_effect35.hover:after {
  opacity: 1;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 10px;
  right: 10px;
}
figure.ct_icon_effect35:hover h3,
figure.ct_icon_effect35.hover h3,
figure.ct_icon_effect35:hover p,
figure.ct_icon_effect35.hover p,
figure.ct_icon_effect35:hover i,
figure.ct_icon_effect35.hover i {
  -webkit-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
  opacity: 1;
}

/****** ct_icon_effect36 ******/

.ct_icon_effect36 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: center;
  font-size: 16px;
  text-transform: uppercase;
  box-shadow: none !important;
}

.ct_icon_effect36 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.ct_icon_effect36 .image {
  padding: 15px 0;
}

.ct_icon_effect36 img {
  max-width: 100%;
  backface-visibility: hidden;
  vertical-align: top;
  position: relative;
  opacity: 0.7;
}

.ct_icon_effect36 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect36 i {
  position: absolute;
  margin: 0;
  font-size: 90px;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.ct_icon_effect36 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.ct_icon_effect36:hover img,
.ct_icon_effect36.hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  opacity: 1;
}

.ct_icon_effect36:hover i,
.ct_icon_effect36.hover i {
  opacity: 1;
}

/****** ct_icon_effect37_up ******/

figure.ct_icon_effect37_up {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.ct_icon_effect37_up * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
figure.ct_icon_effect37_up img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect37_up i {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -webkit-transform: translate(-50%, -50%) scale(0);
  transform: translate(-50%, -50%) scale(0);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  z-index: 1;
}
figure.ct_icon_effect37_up a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect37_up:after {
  background: #000000;
  width: 100%;
  height: 50%;
  position: absolute;
  left: 0;
  top: 0;
  content: '';
  opacity: 0.7;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
figure.ct_icon_effect37_up:hover i,
figure.ct_icon_effect37_up.hover i {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  transition: all 300ms 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
figure.ct_icon_effect37_up:hover:after,
figure.ct_icon_effect37_up.hover:after {
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

/****** ct_icon_effect37_down ******/

figure.ct_icon_effect37_down {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.ct_icon_effect37_down * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.ct_icon_effect37_down img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect37_down i {
  position: absolute;
  top: 0%;
  left: 50%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  z-index: 1;
  opacity: 0;
}
figure.ct_icon_effect37_down a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect37_down:after {
  background: #000000;
  width: 100%;
  height: 50%;
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  opacity: 0.7;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
figure.ct_icon_effect37_down:hover i,
figure.ct_icon_effect37_down.hover i {
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  top: 50%;
  opacity: 1;
  transition: all 400ms 0ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
figure.ct_icon_effect37_down:hover:after,
figure.ct_icon_effect37_down.hover:after {
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}

/****** ct_icon_effect38 ******/

figure.ct_icon_effect38 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.ct_icon_effect38 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.ct_icon_effect38 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect38 i {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -webkit-transform: translate(-50%, -50%) scale(0);
  transform: translate(-50%, -50%) scale(0);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  z-index: 1;
}
figure.ct_icon_effect38 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect38:after {
  background: #000000;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  content: '';
  opacity: 0.7;
  -webkit-transform: skew(-45deg) translateX(150%);
  transform: skew(-45deg) translateX(150%);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
figure.ct_icon_effect38:hover i,
figure.ct_icon_effect38.hover i {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  transition: all 300ms 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
figure.ct_icon_effect38:hover:after,
figure.ct_icon_effect38.hover:after {
  -webkit-transform: skew(-45deg) translateX(50%);
  transform: skew(-45deg) translateX(50%);
}

/****** ct_icon_effect39 ******/

figure.ct_icon_effect39 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
  -webkit-perspective: 50em;
  perspective: 50em;
}
figure.ct_icon_effect39 * {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
figure.ct_icon_effect39 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect39 figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  position: absolute;
  opacity: 0;
  z-index: 1;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.ct_icon_effect39 h2,
figure.ct_icon_effect39 h4 {
  margin: 0;
}
figure.ct_icon_effect39 h2 {
  font-weight: 600;
  font-size: 24px;
  line-height: 24px;
}
figure.ct_icon_effect39 h4 {
  font-weight: 400;
  text-transform: uppercase;
}
figure.ct_icon_effect39 i {
  font-size: 32px;
}
figure.ct_icon_effect39:after {
  background-color: #ffffff;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: rotateX(90deg);
  transform: rotateX(90deg);
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  opacity: 0;
}
figure.ct_icon_effect39 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect39:hover figcaption,
figure.ct_icon_effect39.hover figcaption {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect39:hover:after,
figure.ct_icon_effect39.hover:after {
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
  opacity: 0.9;
}

/****** ct_icon_effect40 ******/

.ct_icon_effect40 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #ffffff;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.ct_icon_effect40 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-out;
  transition: all 0.35s ease-out;
}
.ct_icon_effect40 img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect40 i {
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 28px;
  color: #ffffff;
  width: 50px;
  height: 50px;
  line-height: 50px;
  z-index: 1;
}
.ct_icon_effect40:after {
  background: #9b59b6;
  width: 50px;
  height: 50px;
  position: absolute;
  top: 15px;
  right: 15px;
  content: '';
  border-radius: 50%;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect40 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
.ct_icon_effect40:hover img,
.ct_icon_effect40.hover img {
  opacity: 0.4;
}
.ct_icon_effect40:hover:after,
.ct_icon_effect40.hover:after {
  -webkit-transform: scale(10);
  transform: scale(10);
  opacity: 0.75;
}
.ct_icon_effect40:hover i,
.ct_icon_effect40.hover i {
  -webkit-transform: scale(2) translate(-10px, 10px);
  transform: scale(2) translate(-10px, 10px);
}

/****** ct_icon_effect41 ******/

figure.ct_icon_effect41 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.ct_icon_effect41 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
figure.ct_icon_effect41 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect41 i {
  position: absolute;
  top: 100%;
  left: 50%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
figure.ct_icon_effect41 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
figure.ct_icon_effect41:hover img,
figure.ct_icon_effect41.hover img {
  opacity: 0.3;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
figure.ct_icon_effect41:hover i,
figure.ct_icon_effect41.hover i {
  top: 50%;
  transition: all 500ms 100ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  opacity: 1;
}

/****** ct_icon_effect42 ******/

.ct_icon_effect42 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #ffffff;
  color: #ffffff;
  text-align: left;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.ct_icon_effect42 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-out;
  transition: all 0.35s ease-out;
}
.ct_icon_effect42 img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect42 i {
  position: absolute;
  left: 15px;
  bottom: 15px;
  font-size: 28px;
  color: #ffffff;
  width: 50px;
  height: 50px;
  line-height: 50px;
  z-index: 1;
  text-align: center;
}
.ct_icon_effect42 figcaption {
  position: absolute;
  top: 0;
  left: 0;
  padding: 20px;
  z-index: 1;
  max-width: 250px;
}
.ct_icon_effect42 h3,
.ct_icon_effect42 p {
  opacity: 0;
  margin: 0 0 5px;
}
.ct_icon_effect42 h3 {
  font-weight: 400;
  text-transform: uppercase;
  -webkit-transform: translateX(-40px);
  transform: translateX(-40px);
  font-size: 22px;
  color: #fff;
}
.ct_icon_effect42 h3 span {
  font-weight: 800;
}
.ct_icon_effect42 p {
  font-size: 14px;
  font-size: 500;
  -webkit-transition-delay: 0;
  transition-delay: 0;
}
.ct_icon_effect42:after {
  background: #962d22;
  width: 50px;
  height: 50px;
  position: absolute;
  left: 15px;
  bottom: 15px;
  content: '';
  border-radius: 50%;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect42 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
.ct_icon_effect42:hover img,
.ct_icon_effect42.hover img {
  opacity: 0.4;
}
.ct_icon_effect42:hover:after,
.ct_icon_effect42.hover:after {
  -webkit-transform: scale(10);
  transform: scale(10);
  opacity: 0.75;
}
.ct_icon_effect42:hover i,
.ct_icon_effect42.hover i {
  -webkit-transform: scale(2) translate(10px, -10px);
  transform: scale(2) translate(10px, -10px);
}
.ct_icon_effect42:hover h3,
.ct_icon_effect42.hover h3 {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}
.ct_icon_effect42:hover p,
.ct_icon_effect42.hover p {
  opacity: 1;
  -webkit-transition-delay: 0.25s;
  transition-delay: 0.25s;
}

/****** ct_icon_effect43_down ******/

.ct_icon_effect43_down {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: center;
  background-color: #000000;
}
.ct_icon_effect43_down * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s 0.5s ease;
  transition: all 0.35s 0.5s ease;
}
.ct_icon_effect43_down img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect43_down figcaption {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.ct_icon_effect43_down h2 {
  position: absolute;
  margin: 0;
  width: 100%;
  left: 0;
  top: 50%;
  opacity: 0;
  padding: 0 30px;
  display: inline-block;
  font-weight: 300;
  font-size: 22px;
  color: #fff;
  text-transform: uppercase;
}
.ct_icon_effect43_down .icons {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}
.ct_icon_effect43_down i {
  padding: 10px 5px;
  display: inline-block;
  font-size: 24px;
  color: #ffffff;
  text-align: center;
  opacity: 0.7;
}
.ct_icon_effect43_down i:hover {
  opacity: 1;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect43_down:before {
  position: absolute;
  bottom: 0;
  top: 100%;
  right: 0;
  left: 0;
  content: '';
  background-color: #75231a;
  z-index: 1;
  opacity: 0.5;
  -webkit-transition: all 0.35s 0.3s ease-in;
  transition: all 0.35s 0.3s ease-in;
}
.ct_icon_effect43_down:after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 200px 200px 0 200px;
  border-color: #75231a transparent transparent transparent;
  opacity: 0.9;
  -webkit-transition: all 0.35s 0s ease-out;
  transition: all 0.35s 0s ease-out;
}
.ct_icon_effect43_down:hover img,
.ct_icon_effect43_down.hover img {
  opacity: 0.5;
}
.ct_icon_effect43_down:hover h2,
.ct_icon_effect43_down.hover h2,
.ct_icon_effect43_down:hover .icons,
.ct_icon_effect43_down.hover .icons {
  opacity: 1;
}
.ct_icon_effect43_down:hover h2,
.ct_icon_effect43_down.hover h2 {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
.ct_icon_effect43_down:hover:before,
.ct_icon_effect43_down.hover:before {
  top: 0;
  -webkit-transition: all 0.35s 0s ease-out;
  transition: all 0.35s 0s ease-out;
}
.ct_icon_effect43_down:hover:after,
.ct_icon_effect43_down.hover:after {
  bottom: 25%;
  -webkit-transition: all 0.35s 0.2s ease-in;
  transition: all 0.35s 0.2s ease-in;
}

/****** ct_icon_effect43_up ******/

.ct_icon_effect43_up {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: center;
}
.ct_icon_effect43_up * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s 0.5s ease;
  transition: all 0.35s 0.5s ease;
}
.ct_icon_effect43_up img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect43_up figcaption {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.ct_icon_effect43_up h2 {
  position: absolute;
  margin: 0;
  width: 100%;
  left: 0;
  top: 50%;
  opacity: 0;
  padding: 0 30px;
  display: inline-block;
  font-weight: 300;
  font-size: 22px;
  color: #fff;
  text-transform: uppercase;
  -webkit-transform: translate(0, -100%);
  transform: translate(0, -100%);
}
.ct_icon_effect43_up .icons {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
}
.ct_icon_effect43_up i {
  padding: 10px 5px;
  display: inline-block;
  font-size: 24px;
  color: #ffffff;
  text-align: center;
  opacity: 0.7;
}
.ct_icon_effect43_up i:hover {
  opacity: 1;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect43_up:before {
  position: absolute;
  top: 0;
  bottom: 100%;
  right: 0;
  left: 0;
  content: '';
  background-color: #34495e;
  z-index: 1;
  opacity: 0.5;
  -webkit-transition: all 0.35s 0.3s ease-in;
  transition: all 0.35s 0.3s ease-in;
}
.ct_icon_effect43_up:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 200px 200px 200px;
  border-color: transparent transparent #34495e transparent;
  opacity: 0.8;
  -webkit-transition: all 0.35s 0s ease-out;
  transition: all 0.35s 0s ease-out;
}
.ct_icon_effect43_up:hover h2,
.ct_icon_effect43_up.hover h2,
.ct_icon_effect43_up:hover .icons,
.ct_icon_effect43_up.hover .icons {
  opacity: 1;
}
.ct_icon_effect43_up:hover h2,
.ct_icon_effect43_up.hover h2 {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}
.ct_icon_effect43_up:hover:before,
.ct_icon_effect43_up.hover:before {
  bottom: 0;
  -webkit-transition: all 0.35s 0s ease-out;
  transition: all 0.35s 0s ease-out;
}
.ct_icon_effect43_up:hover:after,
.ct_icon_effect43_up.hover:after {
  top: 25%;
  -webkit-transition: all 0.35s 0.2s ease-in;
  transition: all 0.35s 0.2s ease-in;
}

/****** ct_icon_effect44 ******/

figure.ct_icon_effect44 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
}
figure.ct_icon_effect44 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
}
figure.ct_icon_effect44 img {
  max-width: 100%;
  vertical-align: top;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
figure.ct_icon_effect44 figcaption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  padding: 0 20px;
}
figure.ct_icon_effect44 figcaption:before,
figure.ct_icon_effect44 figcaption:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 40px;
  background-color: #ffffff;
  -webkit-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
  z-index: -1;
}
figure.ct_icon_effect44 figcaption:before {
  left: 0;
  top: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.ct_icon_effect44 figcaption:after {
  left: 0;
  bottom: 0;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}
figure.ct_icon_effect44 h3 {
  position: absolute;
  left: 15px;
  bottom: 0;
  line-height: 40px;
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
}
figure.ct_icon_effect44 .icons {
  position: absolute;
  right: 15px;
  top: 0;
}
figure.ct_icon_effect44 .icons a {
  display: inline-block;
}
figure.ct_icon_effect44 .icons i {
  color: #ffffff;
  line-height: 40px;
  width: 32px;
  font-size: 1.4em;
  padding: 0;
  text-align: center;
  display: inline-block;
  margin: 0;
}
figure.ct_icon_effect44 .icons i:hover {
  background-color: #0b311b;
  color: #ffffff;
}
figure.ct_icon_effect44:hover figcaption,
figure.ct_icon_effect44.hover figcaption {
  color: #0b311b;
}
figure.ct_icon_effect44:hover figcaption:before,
figure.ct_icon_effect44.hover figcaption:before,
figure.ct_icon_effect44:hover figcaption:after,
figure.ct_icon_effect44.hover figcaption:after {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}
figure.ct_icon_effect44:hover figcaption i,
figure.ct_icon_effect44.hover figcaption i {
  color: #0b311b;
}

/****** ct_icon_effect45 ******/

figure.ct_icon_effect45 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
}
figure.ct_icon_effect45 * {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
figure.ct_icon_effect45 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect45 figcaption {
  top: 50%;
  left: 20px;
  right: 20px;
  position: absolute;
  opacity: 0;
  z-index: 1;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
figure.ct_icon_effect45 h2,
figure.ct_icon_effect45 h4 {
  margin: 0;
}
figure.ct_icon_effect45 h2 {
  font-weight: 600;
  font-size: 22px;
}
figure.ct_icon_effect45 h4 {
  font-weight: 400;
  text-transform: uppercase;
}
figure.ct_icon_effect45 i {
  font-size: 32px;
}
figure.ct_icon_effect45:after {
  background-color: #ffffff;
  position: absolute;
  content: "";
  display: block;
  top: 20px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 100% 100%;
  -ms-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
  opacity: 0;
}
figure.ct_icon_effect45 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.ct_icon_effect45:hover figcaption,
figure.ct_icon_effect45.hover figcaption {
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 1;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
figure.ct_icon_effect45:hover:after,
figure.ct_icon_effect45.hover:after {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
  opacity: 0.9;
}

/****** ct_icon_effect46 ******/

figure.ct_icon_effect46 {
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.ct_icon_effect46 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
figure.ct_icon_effect46 img {
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect46 i {
  position: absolute;
  top: 50%;
  left: 100%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  opacity: 0;
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
  transform: translate(-50%, -50%) rotate(180deg);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
figure.ct_icon_effect46 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
figure.ct_icon_effect46:hover img,
figure.ct_icon_effect46.hover img {
  opacity: 0.3;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
figure.ct_icon_effect46:hover i,
figure.ct_icon_effect46.hover i {
  left: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(0deg);
  transform: translate(-50%, -50%) rotate(0deg);
  transition: all 500ms 100ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  opacity: 1;
}

/****** ct_icon_effect47 ******/

figure.ct_icon_effect47 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
}
figure.ct_icon_effect47 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
}
figure.ct_icon_effect47 img {
  opacity: 1;
  max-width: 100%;
  vertical-align: top;
}
figure.ct_icon_effect47 figcaption {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
figure.ct_icon_effect47 figcaption:before {
  content: '';
  position: absolute;
  width: 44px;
  height: 100%;
  right: 0;
  top: 0;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  background-color: #ffffff;
  -webkit-transition: all 0.25s ease-in;
  transition: all 0.25s ease-in;
  z-index: -1;
}
figure.ct_icon_effect47 h3 {
  padding: 8px 12px;
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0;
  font-weight: 800;
  font-size: 18px;
  text-transform: uppercase;
}
figure.ct_icon_effect47 .icons {
  position: absolute;
  top: 5px;
  width: 44px;
  right: 0;
}
figure.ct_icon_effect47 .icons a {
  display: inline-block;
}
figure.ct_icon_effect47 .icons i {
  color: #ffffff;
  line-height: 38px;
  width: 44px;
  font-size: 1.4em;
  padding: 0;
  text-align: center;
  display: inline-block;
  margin: 0;
}
figure.ct_icon_effect47 .icons i:hover {
  background-color: #164666;
  color: #ffffff;
}
figure.ct_icon_effect47:hover img,
figure.ct_icon_effect47.hover img {
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
}
figure.ct_icon_effect47:hover figcaption:before,
figure.ct_icon_effect47.hover figcaption:before {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
figure.ct_icon_effect47:hover figcaption h3,
figure.ct_icon_effect47.hover figcaption h3 {
  -webkit-transform: translateX(-44px);
  transform: translateX(-44px);
}
figure.ct_icon_effect47:hover figcaption i,
figure.ct_icon_effect47.hover figcaption i {
  color: #164666;
}

/****** ct_icon_effect48 ******/

figure.ct_icon_effect48 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #333;
  text-align: left;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  border-bottom: 10px solid #ffffff;
}
figure.ct_icon_effect48 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s cubic-bezier(0.25, 0.5, 0.5, 0.9);
  transition: all 0.35s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}
figure.ct_icon_effect48 img {
  max-width: 100%;
  vertical-align: middle;
}
figure.ct_icon_effect48 blockquote {
  position: relative;
  background-color: #ffffff;
  padding: 40px 25px 25px 50px;
  font-size: 0.8em;
  font-weight: 500;
  text-align: right;
  margin: 0;
  line-height: 1.6em;
  font-style: italic;
}
figure.ct_icon_effect48 blockquote:after {
  width: 90px;
  height: 90px;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  z-index: 1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.35) 100%);
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  background-color: #20638f;
  -webkit-transform: skew(-45deg) translateX(-50%);
  transform: skew(-45deg) translateX(-50%);
  border-right: 1px solid #20638f;
}
figure.ct_icon_effect48:before {
  width: 40px;
  height: 40px;
  position: absolute;
  bottom: 0;
  right: 0;
  content: '';
  -webkit-transform: skew(-45deg);
  transform: skew(-45deg);
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  z-index: 1;
  background-color: #ffffff;
  -webkit-transform: skew(-45deg) translateX(50%);
  transform: skew(-45deg) translateX(50%);
  border-right: 1px solid #ffffff;
}
figure.ct_icon_effect48 i {
  position: absolute;
  color: #ffffff;
  font-size: 32px;
  z-index: 2;
  padding: 8px 12px;
}
figure.ct_icon_effect48 .author {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 10px 20px;
  color: #ffffff;
  margin: 0;
  text-transform: uppercase;
}
figure.ct_icon_effect48 .author h5 {
  opacity: 0.8;
  margin: 0;
  font-weight: 800;
}
figure.ct_icon_effect48 .author h5 span {
  font-weight: 400;
  text-transform: none;
  display: block;
}

/****** ct_icon_effect49 ******/

.ct_icon_effect49 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  background: #ffffff;
  color: #ffffff;
  text-align: left;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.ct_icon_effect49 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-out;
  transition: all 0.35s ease-out;
}
.ct_icon_effect49 img {
  max-width: 100%;
  vertical-align: top;
}
.ct_icon_effect49 i {
  position: absolute;
  right: 15px;
  bottom: 15px;
  font-size: 28px;
  color: #ffffff;
  width: 50px;
  height: 50px;
  line-height: 50px;
  z-index: 1;
  text-align: center;
}
.ct_icon_effect49 figcaption {
  position: absolute;
  top: 0;
  left: 0;
  padding: 20px;
  z-index: 1;
  max-width: 250px;
}
.ct_icon_effect49 h3 {
  opacity: 0;
  margin: 0 0 5px;
  font-weight: 400;
  font-size: 18px;
  color: #fff;
  text-transform: uppercase;
  -webkit-transform: translate(-20px, -20px);
  transform: translate(-20px, -20px);
}
.ct_icon_effect49 h3 span {
  font-weight: 800;
}
.ct_icon_effect49:before {
  background: #962d22;
  width: 50px;
  height: 50px;
  position: absolute;
  top: -80px;
  left: 15px;
  content: '';
  opacity: 0;
  border-radius: 50%;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  z-index: 1;
}
.ct_icon_effect49:after {
  background: #962d22;
  width: 50px;
  height: 50px;
  position: absolute;
  right: 15px;
  bottom: 15px;
  content: '';
  border-radius: 50%;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}
.ct_icon_effect49 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
.ct_icon_effect49:hover img,
.ct_icon_effect49.hover img {
  opacity: 0.4;
}
.ct_icon_effect49:hover:before,
.ct_icon_effect49.hover:before {
  -webkit-transform: scale(8);
  transform: scale(8);
  opacity: 0.75;
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}
.ct_icon_effect49:hover:after,
.ct_icon_effect49.hover:after {
  -webkit-transform: scale(4);
  transform: scale(4);
  opacity: 0.75;
}
.ct_icon_effect49:hover i,
.ct_icon_effect49.hover i {
  -webkit-transform: scale(1.5) translate(-10px, -10px);
  transform: scale(1.5) translate(-10px, -10px);
}
.ct_icon_effect49:hover h3,
.ct_icon_effect49.hover h3 {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

/****** ct_icon_effect50 ******/

.ct_icon_effect50 {
  font-family: 'Raleway', Arial, sans-serif;
  color: #fff;
  position: relative;
  float: left;
  overflow: hidden;
  width: 100%;
  color: #000000;
  text-align: center;
  background-color: #ffffff;
}
.ct_icon_effect50 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}
.ct_icon_effect50 img {
  max-width: 100%;
  vertical-align: top;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}
.ct_icon_effect50 figcaption {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%;
  z-index: 1;
}
.ct_icon_effect50 h2,
.ct_icon_effect50 p {
  margin: 0;
  width: 100%;
  left: 0;
  opacity: 0;
}
.ct_icon_effect50 h2 {
  padding: 0 30px;
  display: inline-block;
  font-weight: 400;
  text-transform: uppercase;
  bottom: 50%;
  font-size: 22px;
  -webkit-transform: translateX(-100px);
  transform: translateX(-100px);
}
.ct_icon_effect50 h2 span {
  font-weight: 400;
}
.ct_icon_effect50 p {
  top: 50%;
  padding: 0 50px;
  font-size: 0.8em;
  font-weight: 500;
  -webkit-transform: translateX(-50px);
  transform: translateX(-50px);
}
.ct_icon_effect50 .icons {
  -webkit-transform: translateX(50px);
  transform: translateX(50px);
  opacity: 0;
}
.ct_icon_effect50 i {
  padding: 2px 5px;
  display: inline-block;
  font-size: 28px;
  color: #000000;
  text-align: center;
  opacity: 0.5;
}
.ct_icon_effect50 i:hover {
  opacity: 1;
}
.ct_icon_effect50 a {
  text-decoration: none;
}
.ct_icon_effect50:hover img,
.ct_icon_effect50.hover img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.2;
}
.ct_icon_effect50:hover h2,
.ct_icon_effect50.hover h2,
.ct_icon_effect50:hover p,
.ct_icon_effect50.hover p,
.ct_icon_effect50:hover .icons,
.ct_icon_effect50.hover .icons {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.ct_icon_effect50:hover h2,
.ct_icon_effect50.hover h2,
.ct_icon_effect50:hover .icons,
.ct_icon_effect50.hover .icons {
  opacity: 1;
}
.ct_icon_effect50:hover p,
.ct_icon_effect50.hover p {
  opacity: 0.7;
}