@media (min-width : 992px){
 .navbar-expand-lg {
        flex-wrap: wrap;
        
            -ms-flex-wrap: wrap;
            padding: 0;
    }
    .navbar-brand{
        width: 100%;
        display: flex;
            justify-content: space-between;
            margin-bottom: 10px;
    }
    .navbar-expand-lg .navbar-collapse{
        justify-content: center;
    }
    #pro-navbar{
        margin-bottom: 10px;
    }
header{
   
    padding: 2.1875rem 0 0 0;
    border-bottom:#f66300 6px solid;
}
.header-contact a.tel{
    background: url(images/tel.jpg) no-repeat left;
    line-height: 2.5rem;
    display: inline-block;
    padding-left: 2.75rem;
}
.header-contact a.email{
    background: url(images/email.jpg) no-repeat left;
    line-height: 2.5rem;
    display: inline-block;
    padding-left: 2.75rem;
}
.sy-pro-list .media-pro{flex: 0 0 24%;}
.sy-pro-list .media-pro .pro-img{overflow: hidden;}
.sy-pro-list .media-pro .pro-img img{transition:0.4s;}
.sy-pro-list .media-pro .pro-body{position: absolute;width: 100%;height: 100%;background: rgba(0, 0, 0, 0);top:50%;left:50%;transform: translate(-50%,-50%);transition: 0.4s;}
.sy-pro-list .media-pro .pro-body span{width:100%;height:100%;border:0px solid #dadada;display: block;transition: 0.4s;overflow: hidden;}
.sy-pro-list .media-pro .pro-body span h3{color: #fff;font-size: 1.125rem;transform: translateY(-1000%);transition: 0.4s;}
.sy-pro-list .media-pro .pro-body span a{color: #fff;background: #f66300;padding:0.625rem 1.125rem;transform: translateY(1000%);transition: 0.4s;}
.sy-pro-list .media-pro:hover .pro-body{background: rgba(0, 0, 0, 0.6);}
.sy-pro-list .media-pro:hover span{width: 85%;height: 85%;border:3px solid #dadada;}
.sy-pro-list .media-pro:hover .pro-img img{transform: scale(1.4,1.4);}
.sy-pro-list .media-pro:hover .pro-body span h3{transform: translateY(0);}
.sy-pro-list .media-pro:hover .pro-body span a{transform: translateY(0);}
}
@media (max-width: 767.98px){
    .navbar>.container, .navbar>.container-fluid{
        flex-wrap: nowrap;
    }
    .header-contact{
        border-top: 1px solid #dcdcdc;
        margin-top: 0.9375rem;
        padding-top: 0.625rem;
    }
    
    .sy-pro{
        padding: 1.875rem 0;
    }
    footer{
        padding: 1.25rem 0;
    }
    footer .copyright{
        line-height: 1.875rem;
    }
    .sy-pro-list .media-pro .pro-img{overflow: hidden;}
    .sy-pro-list .media-pro .pro-body{position: absolute;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.4);top:50%;left:50%;transform: translate(-50%,-50%);}
    .sy-pro-list .media-pro .pro-body span{width:85%;height:85%;border:3px solid #dadada;display: block;overflow: hidden;}
    .sy-pro-list .media-pro .pro-body span h3{color: #fff;font-size: 1.125rem;transform: translateY(0);}
    .sy-pro-list .media-pro .pro-body span a{color: #fff;background: #f66300;padding:0.625rem 1.125rem;transform: translateY(0);}
}
@media (max-width : 375.99px){
    .header-contact a.tel{
        background-size: 17% auto!important;
        padding-left: 2.5rem;
    }
    .header-contact a.email{
        background-size: 22% auto!important;
        padding-left: 2.5rem;
    }
}
