img {
border: none;
max-width: 100%;
}
.clear {
clear: both;
width: 100%;
height: 1px;
}  section.list-section {
padding: 80px 0;
}
.container {
max-width: 1000px;
margin: 0 auto;
}
ul.listing-seventeen {
margin: 0;
padding: 0;
font-family: 'Open Sans', sans-serif;
}
.ilist_pinfo5_1{
width:100%;
}
.ilist_pinfo5_2{
width:50%;
}
.ilist_pinfo5_3{
width:33.33%;
}
.ilist_pinfo5_4{
width:25%;
}
.ilist_pinfo5_5{
width:20%;
}
.ilist_pinfo5_6{
width:16.6%;
}
.ilist_pinfo5_7{
width:14.2%;
}
.ilist_pinfo5_8{
width:12.5%;
}
ul.listing-seventeen li.list-style-seventeen {
display: inline-block;
float: left;
position: relative;
box-sizing: border-box;
padding: 10px;
-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.list-seventeen-inner-part {
position: relative;
bottom: 0;
margin: 15px 0 15px 30px;
background-color: #3ac1d7;
border: 5px solid #ffffff;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=90, Color=#dadada)"; -moz-box-shadow: 0px 0px 5px #dadada; -webkit-box-shadow: 0px 0px 5px #dadada; box-shadow: 0px 0px 5px #dadada; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=90, Color=#dadada); -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; }
.list-seventeen-sl {
background: -moz-linear-gradient(0deg, #f07c89 0%, #ea5362 100%); background: -webkit-gradient(linear, 0deg, color-stop(0%, #f07c89), color-stop(100%, #ea5362)); background: -webkit-linear-gradient(0deg, #f07c89 0%, #ea5362 100%); background: -o-linear-gradient(0deg, #f07c89 0%, #ea5362 100%); background: -ms-linear-gradient(0deg, #f07c89 0%, #ea5362 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f07c89', endColorstr='#ea5362', GradientType='1'); background: linear-gradient(90deg, #f07c89 0%, #ea5362 100%); padding: 10px 20px 10px 60px;
text-align: left;
color: #ffffff;
margin: 30px 0 0 -30px;
max-width: 250px;
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=10, Direction=135, Color=#484848)"; -moz-box-shadow: 3px 3px 10px #484848; -webkit-box-shadow: 3px 3px 10px #484848; box-shadow: 3px 3px 10px #484848; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=10, Direction=135, Color=#484848); -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; }
.list-seventeen-sl:before {
position: absolute;
content: "";
left: -30px;
top: 110px;
width: 0;
z-index: 0;
border-style: solid;
border-width: 0 25px 25px 0;
border-color: transparent #b34450 transparent transparent;
}
.list-seventeen-sl h2 {
font-size: 60px;
line-height: 60px;
margin: 0;
padding: 0;
color: #ffffff;
}
.list-seventeen-sl h2, .list-seventeen-sl .list-seventeen-avatar {
display: inline-table;
vertical-align:middle;
}
.list-seventeen-sl .list-seventeen-avatar {
width: 62px;
height: 62px;
margin-left: 15px;
-webkit-filter: grayscale(100%); filter: grayscale(100%);
opacity: 0.5;
-webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; display: inline-flex;
justify-content: center;
}
.list-seventeen-content {
padding: 30px;
color: #ffffff;
font-size: 14px;
line-height: 26px;
}
.list-seventeen-content h2 {
margin: 0;
text-transform: uppercase;
color: #ffffff;
font-size: 24px;
}
.list-seventeen-inner-part:hover .list-seventeen-sl .list-seventeen-avatar {
-webkit-filter: grayscale(0); filter: grayscale(0);
opacity: 1;
}
.list-seventeen-inner-part:hover .list-seventeen-sl {
box-shadow: none;
}
.list-seventeen-inner-part:hover {
position: relative;
bottom: 20px;
}
@media screen and (max-width: 767px) {
.ilist_pinfo5_1,.ilist_pinfo5_2,.ilist_pinfo5_3,.ilist_pinfo5_4,.ilist_pinfo5_5,.ilist_pinfo5_6,.ilist_pinfo5_7,.ilist_pinfo5_8 {
width: 100%;
}
}
.qcilist-copy-share-section {
z-index: 99;
display: inline-block;
margin-left: 0;
width: 25px;
height: 25px;
position: absolute;
left: 0;
top: 62px;
}