.offer{ padding:5% 0 5.13%; }
.offer .box-img{ display:block; position:relative; overflow: hidden;}
.offer .box-img img{ transition:all 0.3s ease;}
.offer a:hover.box-img img{ transform: scale(1.2); } 
.offer .title{ font-size:16px; color: #2b2b2b; text-transform: capitalize; display: block; position: relative; padding: 30px 0; text-align: center; text-transform:uppercase;}
.offer .title::after{position: absolute;  width: 99px; height: 1px;  left:50%; margin-left:-49px; bottom: 13px;  background-color:#bbbbbb; content: "";}
.offer .title:hover{ color: #22c8ff; text-decoration: none; }
.offer .pdesc{ text-align: center; color: #8a8a8a; font-size: 13px; line-height: 20px; }
@media (max-width:991px){
.offer .col-md-3{ margin-bottom: 30px; }
}
#wedo{ background:url(../images/wedo-bg.jpg) no-repeat fixed center top; background-size:  cover; padding: 6.8% 0 5.555%; text-align: center; color: #fff;}
#wedo .wedo-title{ font-size: 46px; font-weight: bold; color: #fff; text-align: center; text-transform: uppercase; position: relative; margin-bottom: 50px;}
@media (max-width:767px){#wedo .wedo-title{font-size: 32px;}}
#wedo .wedo-title::after{ background: #fff; width: 99px; height: 1px; content: ""; position: absolute; left: 50%; margin-left: -50px; bottom: -23px;  }
#wedo p{ text-align: center; color: #fff; }
#wedo .more{width: 180px; height: 72px; position: relative; color: #fff; border: 2px solid #fff; font-weight: bold;  margin: 0 auto; line-height: 72px; text-transform: uppercase; margin-top: 3.47%; }
#wedo .more  a{z-index: 3; position: absolute; display: block;  text-align: center; width: 100%; color: #fff; }
#wedo .more:hover a{ color: #22c8ff; z-index: 999;  text-decoration: none;}
#wedo .more::after{ background: #fff; width: 0; height: 100%; content: ""; position: absolute; left: 0; top: 0;transition:all 0.3s ease; z-index: 1;}
#wedo .more:hover::after{  width: 100%;}
#wedo h1{ display: inline; font-size: 14px; }

#projects{ padding:6.25% 0;}
#projects .category,#useful .category{ text-align:center; font-size:25px; color:#333333; text-transform:uppercase; position:relative; margin-bottom:30px;}
#projects .category::after,#useful .category::after,#useful .typename:after{background: #bbbbbb; width: 99px; height: 1px; content: ""; position: absolute; left: 50%; margin-left: -50px; bottom: -13px;  }
#projects .category a,#useful .category a{ color:#333333; text-decoration: none;  }
#projects .list-bor{  border: 1px solid #ddd; position:relative; }
#projects .list-bor::before{ background-color:#22c8ff; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; content: ""; z-index: -1;  transition:all 0.5s ease;}
#projects .list-bor:hover::before{ height: 100%;}
#projects .pj-title{ display: block; padding: 8.8% 2%; text-align: center; color: #2b2b2b; text-transform: capitalize; line-height: 18px;transition:all 0.5s ease;}
#projects .list-bor:hover a.pj-title{ color: #fff; text-decoration: none;}
#projects .p-des{ color:#989b9b; font-size:12px; text-align:center; margin-bottom:50px;}
@media (max-width:991px){
#projects .list-bor{ margin-bottom: 30px; }
}
@media (max-width:767px){#projects .pj-title{padding:5.8% 2%;}}

#useful{ padding-bottom: 6.25%; border-top: 2px solid #d0d0d0; padding-top: 5.25%; }
#useful .category{ margin-bottom:6.2%; }
#useful .free{ color:#22c8ff; font-size: 18px; font-weight: bold; font-style: italic; }
#useful .link-tit{ text-align: center; line-height: 20px; margin-bottom: 30px;}
#useful .typename{ font-size: 14px; text-align: center; font-weight: bold; margin-bottom: 41px;position: relative;}   
#useful .blog{ margin:0; padding: 0; list-style: none;} 
#useful .blog li{ padding:5px; line-height: 18px; }
#useful .blog a{ color: #9e9e9e; }
#useful .blog i{ color: #22c8ff; }
#useful .blog a:hover{ text-indent: 8px; }
@media (max-width:991px){
#useful .min-center{ margin-bottom: 30px; }
}
#mailform{ background: #2b2b2b;  padding:6.08% 0 3.28%; border-bottom: 1px solid #4b4b4b;}
@media (min-width:992px){
#mailform .formshow{ width: 80%; margin: 0 auto; }
}
#mailform .formshow .ustitle{ font-size: 36px; color: #fff; text-align: center;  font-weight: bold; margin-bottom: 6%;}
@media (max-width:767px){#mailform .formshow .ustitle{ font-size: 32px;}}
#mailform .formshow .form-control{background: none; color: #9e9e9e; font-size: 16px; border: 1px solid #9e9e9e;}
#mailform .formshow input.form-control{   height: 51px;}
#mailform .formshow .mailbtn{width: 60%; height: 70px; background-color: #22c8ff; color: #fff; font-size: 18px; margin: 27px auto 0; border: none; display: block;  text-transform: uppercase;transition:all 0.3s ease;}
#mailform .formshow .mailbtn:hover{ color:#2b2b2b; background:#fff; }
@media (max-width:623px){#mailform .formshow .mailbtn{width: 100%;}}