@import url('https://fonts.googleapis.com/css?family=Rozha+One');
@import url('https://fonts.googleapis.com/css?family=Raleway|Rozha+One');

.col4 {width: 32.6%; float: left; position: relative;}
.transition {-webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease;  transition: all .5s ease;}
body .container {
  width: 650;
}

.fx1 .item {margin: 2px 2px 2px 2px;}

.heading {
  font-family: 'Raleway', sans-serif; 
  font-size: 20px; 
  text-transform:uppercase; 
  font-weight:500; 
  text-align:left; 
  line-height:normal; 
  margin:40px 0 20px 0; 
  width: 650;  
  border-bottom:2px solid #666666;
}

.heading span { padding: 0 10px 3px; display:inline-block;}

/* active on focus for accessibility tab navigation */

.fx1 .item {padding: 0;}
.fx1 .item img {padding: 0 !important; display: block; max-width: 100%; height: auto;}
.fx1 a:hover .item img, .fx1 a:focus .item img {-webkit-filter: brightness(20%);}
.fx1 h3, .fx1 h4, .fx1 p {-webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease;  transition: all .5s ease;} 
.fx1 a .item h3 {font-family: 'Raleway', sans-serif; font-size: 8px; position: absolute; color:#fff; text-transform: uppercase; letter-spacing: 2px; position: absolute; top:36%; left:0; right:0; margin:0 auto; text-align: center; opacity: 0;}
.fx1 a:hover .item h3, .fx1 a:focus .item h3 {opacity: 1;}
.fx1 a .item h4 {font-family: 'Raleway', sans-serif; font-size: 16px; position: absolute; color:#fff; text-transform: uppercase; letter-spacing: 2px; position: absolute; top:42%; left:0; right:0; margin:0 auto; text-align: center; opacity: 0;}
.fx1 a:hover .item h4, .fx1 a:focus .item h4 {opacity: 1;}
.fx1 a .item p {font-family: 'Raleway', sans-serif; font-size: 8px; position: absolute; color:#fff; text-transform: uppercase; letter-spacing: 2px; position: absolute; top:52%; left:0; right:0; margin:0 auto; text-align: center; opacity: 0;}
.fx1 a:hover .item p, .fx1 a:focus .item p {opacity: 1;}

@media screen and (max-width: 991px) {
.col4 {width: 49.3%;}
.fx5 a .item h4 {font-size: 13px;}
}   

@media screen and (max-width: 580px) {
.col4 {width: 100%;}
}