@charset "utf-8";

#pros_nav{
    background: url("../images/pros_nav-main-border.jpg") repeat-x left 65px;
}
#pros_nav-main{
    height: 66px;
    line-height: 66px;
    overflow: hidden;
}
#pros_nav-main-cats{
    float: left;
    padding-left: 45px;
    background: url("../images/pros_nav-main-cats-icon.png") no-repeat 4px center;
    font-size: 16px;
}
#pros_nav-main-cats ul{
    overflow: hidden;
}
#pros_nav-main-cats li{
    float: left;
    margin-right: 39px;
}
#pros_nav-main-cats a{
    color: #4e4e4e;
}
#pros_nav-main-cats li.active{
    background: url("../images/pros_nav-main-cats-arrow.png") no-repeat center bottom;
}
#pros_nav-main-cats li.active a{
    color: #077dcc;
}

#pros_nav-main-search{
    float: right;
    padding-top: 17px;
}
#pros_nav-main-search input{
    float: left;
}
#pros_nav-main-search input[type=text]{
    height: 30px;
    line-height: 30px;
    width: 150px;
    border: 1px solid #e4e4e4;
    padding: 0 10px 0 36px;
    background: url("../images/pros_nav-main-search-icon.png") no-repeat 14px center;
}
#pros_nav-main-search input[type=submit]{
    border: none;
    height: 32px;
    line-height: 32px;
    background: #077dcc;
    padding: 0 10px;
    font-size: 16px;
    color: white;
}

#pros_nav-sub{
    background: #fcfcfc;
    height: 46px;
    line-height: 46px;
}
#pros_nav-sub .c{
    overflow: hidden;
}
#pros_nav-sub-cats{
    float: left;
}
#pros_nav-sub-cats ul{
    overflow: hidden;
    padding-left: 4px;
}
#pros_nav-sub-cats li{
    float: left;
    margin-right: 33px;
}
#pros_nav-sub-cats li a{
    color: #808080;
}
#pros_nav-sub-cats li.active a{
    color: #424242;
}
#pros_nav-sub-order{
    float: right;
    overflow: hidden;
}
#pros_nav-sub-order strong,  #pros_nav-sub-order p, #pros_nav-sub-order a, #pros_nav-sub-order i{
    float: left;
}
#pros_nav-sub-order strong{
    color: #282828;
    padding-right: 12px;
}
#pros_nav-sub-order a{
    color: #5b5b5b;
}
#pros_nav-sub-order a.active{
    color: #f39010;
}
#pros_nav-sub-order i{
    color: #ddd;
    padding: 0 16px;
}

#pros_ls{
    overflow: hidden;
}
#pros_ls ul{
    overflow: hidden;
    width: 110%;
    padding-top: 6px;
}
#pros_ls li{
    float: left;
    width: 274px;
    height: 366px;
    margin-right: 34px;
    margin-top: 23px;
}
#pros_ls li div{
    height: 274px;
    background: url("../images/pros_ls-item-img-bg.png") no-repeat center bottom;
    position: relative;
    transition: all .3s;
}
#pros_ls li div img{
    width: 218px;
    height: 218px;
    display: block;
    margin: 0 auto;
    padding-top: 28px;
    transition: all .3s;
    filter: drop-shadow(4px 20px 10px rgba(0,0,0,0));
}

#pros_ls li div i{
    display: block;
    width: 37px;
    height: 37px;
    position: absolute;
    background: url("../images/pros_ls-arrow.png") no-repeat;
    right: 16px;
    bottom: 20px;
    transition: all .3s;
    opacity: 0;
    filter: alpha(opacity=0);
}
#pros_ls li strong{
    display: block;
    height: 28px;
    line-height: 28px;
    text-align: center;
    font-size: 18px;
    color: #4e4e4e;
    padding-top: 14px;
    transition: all .3s;
}
#pros_ls li p{
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    color: #7f7f7f;
    padding-bottom: 10px;
}

#pros_ls li:hover div{
    /*filter: brightness(90%);*/
    background-position: center 166px;
}
#pros_ls li:hover div img{
    -webkit-filter: drop-shadow(8px 8px 10px red);
    filter: drop-shadow(4px 20px 10px rgba(0,0,0,.4));
}
#pros_ls li:hover div i{
    /*bottom: -14px;*/
    bottom: -10px;
    opacity: 1;
    filter: alpha(opacity=100);
}
#pros_ls li:hover strong{
    color: #077dcc;
}
.pages{
    margin-top: 75px;
    margin-bottom: 80px;
}