
/********* Footer Start*********/
.footer {  background:#767676 url(../images/footer-bg-new.png) no-repeat left bottom;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;-ms-background-size: cover; }
.footer a{color: #333f45;}
.footer a:hover{color: #20b8ac;}
.footerTop { padding: 64px 0; }
.footerTopBox { margin: 0; padding: 0; width: 35%;float: left;}
.lastBox{border:0;padding-right: 0;width: 30%;float: right;}
.fooTitle{font-size: 27px;line-height: 27px; color: #20b8ac;font-weight: 400;margin: 0 0 18px 0;padding: 0 0 22px 0;  position: relative; text-transform: uppercase;}
.fooTitle:before{content: "";position: absolute;left: 0;min-width: 252px;height: 2px;bottom: 0;background: #20b8ac;}
.fooTitle:after{content: "";position: absolute;left:0; bottom: -1px;width: 44px;height: 4px;background: #20b8ac;}
.lastBox .fooTitle:before{min-width:inherit;width: 100%;    height: 2px; }
.footerTopBox > ul > li { display: block; clear: both; margin:0;padding:0 0 20px 22px;position: relative;font-size: 18px;line-height: 18px; text-transform: uppercase;}
.footerTopBox > ul > li:after{content: "\f105";position: absolute;left: 0;top: 0;font-family: FontAwesome; color: #20b8ac; }
.footerTopBox > ul > li > a { color: #f4f4f4; }
.footerTopBox ul li a:hover { color: #20b8ac; }
.footerTopOth > ul > li{float: left;width: 50%;clear: none;display: inline-block;}

.footerSocial { display: inline-block; vertical-align: top;padding: 16px 0 0 0; }
.footerSocial ul li{ display: inline-block; vertical-align: top; padding: 0 12px 0 0; margin:0; position: relative;}
.footerSocial ul li a { display: inline-block;vertical-align: middle; background: #ffffff; width: 28px; height: 28px; text-align: center; line-height: 27px; color: #fff; font-size: 18px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;position: relative; }
.footerSocial ul li a:after{
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  bottom: -2px;
  top: -2px;
  border: 1px solid #ffffff;
  border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;
}
.footerSocial ul li a i.fa-facebook{  color: #1b5cc8; }
.footerSocial ul li a i.fa-twitter{  color: #1da7e5; }
.footerSocial ul li a i.fa-linkedin{  color: #0b82d5; }
.footerSocial ul li a i.fa-pinterest{  color: #dd104f; }
.footerSocial ul li a:hover{ background-color: rgba(255,255,255,0.4); }

.copyRightPanel { font-size: 16px; line-height: 16px; color: #ffffff; font-weight: 400; padding: 20px 0;background: #20b8ac; text-align: center; }
.copyRightPanel a{ color: #ffffff; }
.copyRightDiv a:hover{ color: #000; }
.fooLogo{
  margin-bottom: 38px;
}
.fooPara{
  color: #ffffff;
  text-align: justify;
  margin-bottom: 40px;
}
.fooPara a{
  font-weight: 700;
  color: #20b8ac;
  text-transform: uppercase;
}
.fooPara a:hover{
  color: #ffffff;
}
.footer .headerSocial ul li a{
  color: #000;
  width: 37px;
  height: 37px;
  line-height: 37px;
  background: #ffffff;
  font-size: 22px;
}

.footer .headerSocial ul li a:hover{
  color: #ffffff;
  background: #20b8ac;
}
.address{
  font-size: 14px;
  line-height: 18px;
  color: #ffffff;
  font-weight: 400;
  padding: 0;
}
.address .phoneText{
  font-size: 25px;
  line-height: 25px;
}
.address p{
  padding:0 0 14px 28px;
  position: relative;
}
.address a{
  color: #ffffff;
}
.address a:hover{
  color: #20b8ac;
}
.address p i{
  font-size: 20px;
  color: #20b8ac;
  position: absolute;
  left: 0;
  top: 0;
}
.lastBox .fooTitle i{
  width: 34px;
  height: 34px;
  display: inline-block;
  vertical-align: top;
  background: url(../images/comment-icon.png) no-repeat 0 0;
  margin: 0 10px 0 0;
}


/********* Footer End*********/

@media only screen and (max-width: 1200px) {
.fooTitle{
  font-size: 20px;
  line-height: 20px;
}
}
@media only screen and (max-width: 1024px) {
.footerTopBox{
  width: 33.2%;
    margin: 10px 0 0
}
.lastBox{
  width: 33%;
  margin: 10px 0 0
}
}
@media only screen and (max-width: 991px) {

}
@media only screen and (max-width: 767px) {
.footerTopBox{
  width: 100%;
  margin: 0 0 20px 0;
}
.footerTop {
  padding: 30px 0;
}
.messageForm .intBtn{
  width: 100%;
}
.footerTopBox > ul > li {
  padding: 0 0 16px 20px;
  font-size: 16px;
  line-height: 16px;
}
.fooTitle::before{
  min-width: inherit;
  width: 100%;
}
}
@media only screen and (max-width: 640px) {

}


@media only screen and (min-width: 768px) and (max-width: 1023px){
  .footerTopBox{
  width: 50%;
    margin: 10px 0 0
}
.lastBox{
  width: 53%;
  margin: 10px 0 0;
  float: left;
}
}