@charset "utf-8"; 
*{margin:0; padding:0; box-sizing:border-box}
#hpnlmenu ul{float:right; padding:0px 0}
#hpnlmenu, #hpnlmenu ul, #hpnlmenu ul li, #hpnlmenu ul li a, #hpnlmenu #head-mobile{border:0; list-style:none; line-height:1; display:block; position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
#hpnlmenu:after, #hpnlmenu >ul:after{content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0}
#hpnlmenu #head-mobile{display:none}
#hpnlmenu{font-family:sans-serif;  padding:0px 0 0;     width: 100%;}
#hpnlmenu >ul >li{float:left}
#hpnlmenu >ul >li >a{padding:16px 17px; font-size:12px; text-decoration:none;  margin:12px 0; letter-spacing: 0.05em; font-weight: 600; text-transform: uppercase;  font-weight: 500;  font-style: normal; color: #fff;}
#hpnlmenu >ul >li:hover >a, #hpnlmenu ul li.active a{border-radius:3%; color:#fff}
#hpnlmenu ul ul li a:hover{background:#4d7ed2}
#hpnlmenu >ul >li:hover, #hpnlmenu ul li.active:hover, #hpnlmenu ul li.active, #hpnlmenu ul li.has-sub.active:hover{-ms-transition:background .3s ease; transition:background .3s ease}
#hpnlmenu >ul >li.has-sub >a{padding-right:30px}
#hpnlmenu >ul >li.has-sub >a:after{position:absolute; top:19px; right:11px; width:8px; height:2px; display:block; background:#fff; content:''}
#hpnlmenu >ul >li.has-sub >a:before{position:absolute; top:16px; right:14px; display:block; width:2px; height:8px; background:#fff; content:''; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; transition:all .25s ease}
#hpnlmenu >ul >li.has-sub:hover >a:before{top:23px; height:0}
#hpnlmenu ul ul{position:absolute; left:-9999px}
#hpnlmenu ul ul li{height:0; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; background:#222; transition:all .25s ease}
#hpnlmenu ul ul li:hover{}
#hpnlmenu li:hover >ul{left:auto}
#hpnlmenu li:hover >ul >li{height:35px}
#hpnlmenu ul ul ul{margin-left:100%; top:0}
#hpnlmenu ul ul li a{border-bottom:1px solid rgba(150,150,150,0.15); padding:11px 15px; width:190px; font-size:12px; text-decoration:none; color:#ddd; font-weight:400}
#hpnlmenu ul ul li:last-child >a, #hpnlmenu ul ul li.last-item >a{border-bottom:0}
#hpnlmenu ul ul li:hover >a, #hpnlmenu ul ul li a:hover{color:#fff}
#hpnlmenu ul ul li.has-sub >a:after{position:absolute; top:16px; right:11px; width:8px; height:2px; display:block; background:#ddd; content:''}
#hpnlmenu ul ul li.has-sub >a:before{position:absolute; top:13px; right:14px; display:block; width:2px; height:8px; background:#ddd; content:''; -webkit-transition:all .25s ease; -ms-transition:all .25s ease; transition:all .25s ease}
#hpnlmenu ul ul >li.has-sub:hover >a:before{top:17px; height:0}
#hpnlmenu ul ul li.has-sub:hover, #hpnlmenu ul li.has-sub ul li.has-sub ul li:hover{background:#363636}
#hpnlmenu ul ul ul li.active a{border-left:1px solid #333}
#hpnlmenu >ul >li.has-sub >ul >li.active >a, #hpnlmenu >ul ul >li.has-sub >ul >li.active>a{border-top:1px solid #333}
@media screen and (max-width:700px){.logo{position:absolute; top:-5px; left:0; width:100%; height:35px; text-align:center; padding:0px 0 0 0; float:none; border:none}
.logo2{display:none}
nav{width:100%}
#hpnlmenu{width:100%}
#hpnlmenu ul{width:100%; display:none; padding-top:22px}
#hpnlmenu ul ul{  width: 100%;  display: none;  padding-top:0px;}
#hpnlmenu ul li{width:100%;background: #000; border-top:1px solid #444}
#hpnlmenu ul li:hover{background:#363636}
#hpnlmenu ul ul li, #hpnlmenu li:hover >ul >li{height:auto}
#hpnlmenu ul li a, #hpnlmenu ul ul li a{width:100%; border-bottom:0; color:#fff; padding:7px 17px}
#hpnlmenu >ul >li{float:left}
#hpnlmenu ul li a:hover{ color:#fff}
#hpnlmenu ul ul li a{padding-left:25px}
#hpnlmenu ul ul li{background:#333!important}
#hpnlmenu ul ul li:hover{background:#363636!important}
#hpnlmenu ul ul ul li a{padding-left:35px}
#hpnlmenu ul ul li a{color:#ddd; background:none}
#hpnlmenu ul ul li:hover >a, #hpnlmenu ul ul li.active >a{color:#fff}
#hpnlmenu ul ul, #hpnlmenu ul ul ul{position:relative; left:0; width:100%; margin:0; text-align:left}
#hpnlmenu >ul >li.has-sub >a:after, #hpnlmenu >ul >li.has-sub >a:before, #hpnlmenu ul ul >li.has-sub >a:after, #hpnlmenu ul ul >li.has-sub >a:before{display:none}
#hpnlmenu #head-mobile{display:block; padding:10px; color:#ddd; font-size:12px; font-weight:700}
.button{width:55px; height:46px; position:absolute; right:0; top:0px; cursor:pointer; z-index:12399994}
.button:after{position:absolute; top:22px; right:20px; display:block; height:4px; width:20px; border-top:2px solid #fff; border-bottom:2px solid #fff; content:''}
.button:before{-webkit-transition:all .3s ease; -ms-transition:all .3s ease; transition:all .3s ease; position:absolute; top:16px; right:20px; display:block; height:2px; width:20px; background:#fff; content:''}
.button.menu-opened:after{-webkit-transition:all .3s ease; -ms-transition:all .3s ease; transition:all .3s ease; top:23px; border:0; height:2px; width:19px; background:#fff; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg)}
.button.menu-opened:before{top:23px; background:#fff; width:19px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg)}
#hpnlmenu .submenu-button{position:absolute; z-index:99; right:0; top:0; display:block; border-left:1px solid #444; height:46px; width:46px; cursor:pointer}
#hpnlmenu .submenu-button.submenu-opened{background:#262626}
#hpnlmenu ul ul .submenu-button{height:34px; width:34px}
#hpnlmenu .submenu-button:after{position:absolute; top:22px; right:19px; width:8px; height:2px; display:block; background:#ddd; content:''}
#hpnlmenu ul ul .submenu-button:after{top:15px; right:13px}
#hpnlmenu .submenu-button.submenu-opened:after{background:#fff}
#hpnlmenu .submenu-button:before{position:absolute; top:19px; right:22px; display:block; width:2px; height:8px; background:#ddd; content:''}
#hpnlmenu ul ul .submenu-button:before{top:12px; right:16px}
#hpnlmenu .submenu-button.submenu-opened:before{display:none}
#hpnlmenu ul ul ul li.active a{border-left:none}
#hpnlmenu >ul >li.has-sub >ul >li.active >a, #hpnlmenu >ul ul >li.has-sub >ul >li.active >a{border-top:none}
}
body{color:#616366;  font-size: 16px;  line-height: 1.7;  letter-spacing: 0px; text-align:justify; background-color:#fff; font-family: 'Arial',sans-serif;}
.main{width:100%}
.container{padding-left:15px; padding-right:15px; margin-right:auto; margin-left:auto; width:1140px}
.logo{margin-top:0px; position:relative; z-index:123; padding:3px; font:18px verdana; color:#6DDB07; float:left; width:23%; padding-top:0px}
.headerbg{background:#008ccd; top:-6px;}
header{padding: 0px 0px 0px; position: fixed; z-index: 99;  width: 100%;position: fixed; z-index: 99;width: 100%;float: left;background:#008ccd;}
nav{position:relative; width:1200px; margin:0 auto}
.rb-call {width: 140px; height: 50px; border:2px solid #4c79ff; float: left;  text-align:center;  cursor: pointer; position: absolute; box-sizing: border-box; overflow: hidden;  margin: 0 0 40px 50px; top: 69%; left: 14%;}
/* latin */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Asap Regular'), local('Asap-Regular'), url(https://fonts.gstatic.com/s/asap/v11/KFOoCniXp96ayzse4A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.r-call {  width: 140px;  height: 50px; position: absolute;  transition: all .5s ease;  z-index: 1;  box-sizing: border-box;}
.rb-call a {  font-family: arial;   font-size: 16px;  color:#fff;  text-decoration: none;  line-height: 50px;   transition: all .5s ease;   z-index: 2;   position: relative;}
.white_svg { position: absolute; left: 0;  bottom: -11px;  width: 100%;  overflow: hidden;}
.svg_white svg {  fill: #fff;  width: 101%;}
svg:not(:root) {  overflow: hidden;}
.rb-call a:hover { color:#fff;}
.r-call {background:#4c79ff;  color: #4b4b4b;}
.rb-call:hover .r-call {color: #ffffff;  background-image: linear-gradient(to right, #4b87f04f, #4B87F0, #A1C6FF, #4b87f0);
box-shadow: 0 4px 15px 0 rgb(75, 135, 240);}
.top-scroll_left{ width:20%;  float:left; padding-bottom:21px}
.top-scroll_div{   position:fixed; width:100%; background:#e0f7e2;}
.footer-follow-hpnl li{}
.footer-follow-hpnl img{ width: 58%;}
.top-scroll_left a img{margin:18px 0 0 0px; width:60%}
.top-phone_list, .top-scroll_right{float:right}
.customer-hpnl-support-footer img { }
.customer-hpnl-support-footer p{ color:#7c7980; font-size:13px;}
.top-phone_list, .top-scroll_right{float:right; padding-top:10px}
.top-phone_list ul{padding:6px 0;  float:left; font-family:'roboto',sans-serif}
.top-right ul{width:100%; position:static; padding-top:0px}
.top-right ul li a img{ width:44%}
.top-right ul li{margin:-5px 0px;  padding:0px 0 0; width:36px; display:inline-block; text-align:center; height:25px; vertical-align:baseline}
.top-right ul li a{font-size:18px; padding:0 !important; color:#fff; text-decoration:none}
.top-phone_list li{float:left; padding:7px 300px 7px 48px; font-size:25px}
.top-phone_list li, .top-phone_list li.leftside{text-decoration:none; margin:0 10px;  color:#fff; background:0 0; display:block; white-space:nowrap}
.top-phone_list li.top-sc_btn{    padding: 3px 14px;  margin: -9px 240px 0 0px;  font-size: 22px;}
.top-phone_list li a{text-decoration:none}
.top-phone_list li{float:left; padding:7px 2px 7px 3px; font-size:14px}
.top-phone_list li, .top-phone_list li.leftside{text-decoration:none; margin:0 10px; color:#fff; background:0 0; display:block; white-space:nowrap}
.scroll-btn{border-radius:2px; float:left; margin-right:10px; background:#fff; border:1px solid #2098d1; color:#000!important; padding:4px 10px!important; font-size:16px}
.b-btn, .top-caption-h1, a{text-decoration:none}

/* latin */
@font-face { font-family: 'Raleway'; font-style: normal; font-weight: 400;src: local('Raleway'), local('Raleway-Regular'), url(https://fonts.gstatic.com/s/raleway/v13/1Ptug8zYS_SKggPNyC0ITw.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* latin */
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
.customer-right-side img{ width:100%;}
.all-cover-box{ width:100%; float:left;}
.banner{ width:100%; float:left; background:url(../images/banner.jpg) top center no-repeat; min-height:460px}
.banner img{ width:90%}
* {box-sizing: border-box;}
.mySlides {display: none;}
img {vertical-align: middle;}
.slideshow-container { max-width:100%; position: relative;  margin: auto;}
.mySlides { width: 100%;  padding-top:4%;}
.mySlides img{ width:100%;}
.text-align{ text-align:right}
.gap-point{ padding-bottom:125px !important;}
.hpnl-bg-ul li a{color: #1294d4;}
.numbertext {  color: #f2f2f2; font-size: 12px;  padding: 8px 12px; position: absolute;  top: 0;}
.services-full-four-li{   position: absolute;  bottom:150px; left: 10%; }
.list-icr-service li:hover {top: -4px;}
.hpnl-mail-txt{color:#000; font-size:25px;position: absolute;bottom:55%; font-family: 'Lobster', cursive; text-align:left; left:17%; width:46%;}
.hpnl-mail-tx {font-size: 30px; color:#000;   position: absolute;  bottom: 43%;  text-align: left; font-family: 'Titillium Web', sans-serif; font-weight:bold;   letter-spacing: 1px; line-height: 33px; left: 17%;  width: 35%;}
.tex-hpnl-support{ text-align:center;padding-top: 0px; margin-top: -25px}
.text { color:#000;font-size: 14px; padding: 8px 12px;  position: absolute; bottom:33%;  text-align: left;  width: 35%; left: 17%;    font-family: 'El Messiri', sans-serif;}
.text2 { color:#fff;  font-size:17px; padding: 10px 52px; position: absolute; bottom:23%; text-align: left;left:6%;border-radius: 30px;  background: #ffbd0f; }
.banner-internal{width:100%; float:left; background: url(../images/banner-internal.jpg) top center no-repeat;background-size: cover;min-height: 343px;
  position:relative;}
.srvc-content{ width:100%; float:left; padding:50px 0 50px; position:relative}
.srvc-content h1 {font-weight: normal; font-style: normal;  color: #05001a; font-size:24px;  line-height: 1.1;  padding-bottom: 5px;letter-spacing: -1px;}
.services-top{ text-align:center;  font-size:12px; padding-bottom:7px;color:#000; font-weight: 500;}
.services-full-cover{ width:100%; float:left; margin-top:20px; position:relative;}
.single-service{ width:100%; float:left;padding: 20px 20px 100px 20px;}
.services-top-right{ width:32%; float:right; padding: 20px 20px 20px 20px;   border-style: solid; border-width: 1px 1px 1px 1px;  border-color: #ebebeb;}
.serv{     width: 20%;float: right;}
.srvc-content-side{ width: 75%; float: left; }
.single-service-cover p{ text-align:right !important}
.services-top-right-cover p{ text-align:left !important}
.srvc-content-side h3 {font-size:15px;  letter-spacing: 0.5px;  padding-bottom: 5px;  color:#000; font-family: "Raleway",sans-serif;  font-weight: bold;}
.srvc-content-side p {font-size: 14px !important;  font-family: 'Lato', sans-serif; line-height:23px;  padding:0 !important;}
.srvc-content p{padding: 3px 0; text-align: justify; font-size: 15px; }
.footer{ width:100%; float:left; padding: 8px 0px; background:#0081bd;
text-align: center; }
.banner-front {width: 50%;  float: left; margin-top: 16%;  margin-bottom: 9%;  text-align: left;}
.text-system {
    transition: .3s;
    font-weight: 500;
    font-style: normal;
    font-family: Montserrat,sans-serif;
    color:#fff;
    font-size: 30px;
    line-height: 1.2;
    letter-spacing: 0;
}
.text-system-4 {
    font-weight: 400;
    font-style: normal;
    font-family: Montserrat,sans-serif;
    color:#fff;
    margin-bottom: 20px;
    margin-top: 20px;
    font-size: 19px;
    line-height: 1.2;
    letter-spacing: 0;
}
.discl {
    width: 100%;
    background:rgba(43, 45, 47, 0.88);
    margin-bottom: 0px;
}
.call-now {   width: 20%; color: #000; box-shadow: 0 1px 3px -1px rgb(0 0 0 / 30%); margin-left: 0%; border-radius: 5px; float: left;  display: inline-block;   position: relative; margin-top: 2%;  background: #0096d9;  padding: 8px 25px;}
.call-now a {
    color: #fff;
}

.ms-bg { width:100%; float: left; position: relative;
    background-color: #1F303A;
    opacity: 90%;
    height:100%;
}
.banner {
    width: 100%;
    float: left;
    background: url(../images/banner.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    height:auto;
margin-top:3%; padding-bottom:4%;
}
.footer p{ font-size:13px;color:#fff;}
.footer a{ color:#fff; text-decoration:none;}
.serv img{  border-radius: 50%; }
.hpnl-service-client-cover-all{ width:100%; float:left; padding:30px 0;}
.paratx-left p{ width:100%; text-align:justify !important;}
.footer-image{ padding-bottom:10px;}
.col-md-444 {
    width: 50%;
    float: left;
}
.col-md-777 {
    width:50%;
    float: right;
}
.boxes-1 { background:#008ccd;}
.boxes-2 {background:#0081bd;}
.boxes-3 {background:#008ccd;}
.boxes-4 {background:#0081bd;}
.banner-inner {
  width: 100%;
  float: left;
  background: url("../images/banner-in.jpg");
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-size: auto;
  background-position: top;
  background-repeat: no-repeat;
  background-size: cover;
  height: auto;
  margin-top:3%;
}
.banner-inner img {
  width:90%;
}
/* Contact Page */
.hpnl-contact-page{ width:100%; float:left; padding:40px 0 100px; position:relative}
.hpnl-contact-page-left{ width:50%; float:left; padding:20px 0}
.hpnl-contact-page-right{ width:50%; float:right; padding:20px 0}
.bg-tx { font-size: 21px; letter-spacing: 0px; color: #222;  font-weight: bold;  line-height: 30px;  margin-bottom: 50px; font-family: 'Asap', sans-serif;  padding-bottom: 16px; position: relative;}
.bg-tx:before {  content: ''; position: absolute; left: 0; bottom: 0;  height: 5px; width: 55px;  background-color:#008ccd}
.show-tx:after{  content: '';   position: absolute; left: 0;  bottom: 2px;  height: 1px;  width: 255px;  background-color:#008ccd}
.bg-tx .show-tx:after {  width: 255px;}
.bg-tx:before {  height: calc(100% - 40px);}
.bg-tx .show-tx:after {width: 0;  -webkit-transition: all 0.4s ease 0s;  -o-transition: all 0.4s ease 0s;  transition: all 0.4s ease 0s;}
.bg-tx .show-tx:after {  opacity: 1;}
.tx-contact-ul{ width:100%; float:left;}
.tx-contact-ul li{ list-style:none; font-size: 14px;   color: #333;   letter-spacing: 0;   line-height: 23px;   margin-bottom: 13px;  font-weight: 500;}
.tx-contact-ul li a{ text-decoration:none; color:#333;}
.social-link {  display: inline-block; margin-top: 11px;}
.social-link h5 { font-family: 'Montserrat', sans-serif; display: inline-block; font-size: 16px; letter-spacing: 0;  font-weight: 600;  color: #222222; margin-right: 22px;}
.social-link a {  display: inline-block;vertical-align: bottom;  font-size: 15px;  color: #333333;  margin-right: 11px;}
.contact-form form input, .contact-form form textarea {  height: 34px; width: 100%;  background: #fff; border: none;  border-bottom: 1px solid #dddddd;   margin-bottom: 20px; letter-spacing: 0;  font-size: 13px;}
.contact-form form input, .contact-form form textarea { height: 34px; padding:10px; width: 100%; background: #fff; border: none; border-bottom: 1px solid #dddddd;   margin-bottom: 20px;  letter-spacing: 0;  font-size: 13px;}
.contact-form form .form-submit {text-align: right;}
.contact-form form button { background:#007cb6; color: #fff; border: none; text-transform: uppercase; font-size: 12px; padding: 9px 25px; font-weight: 400; cursor: pointer;  outline: none;}
.contact-form form textarea { height: 87px;}
.hpnl-serv p{ display:inline-block; font-size: 15px;}
.reco-support-four-boxes { width:100%; float:left; padding:0px 0;}
.reco-support-four-boxes-one:hover { }
.services {  text-align: center; padding-bottom:5px; font-weight:bold;  font-size: 20px; color:#0665c9;   text-transform: uppercase; letter-spacing: .075em;}
.services-line {background:#011230; width: 10%;  padding:1px; text-align: center !important;  margin: 0 auto 30px;}
.reco-support-four-boxes-one {width: 25%; float: left;}
.box-modern-media { text-align:center; margin-bottom: 10px;}
.reco-support-four-boxes-one p{ color: #ccc; text-align:center;padding-top: 10px; font-size: 14px;}
.box-modern-sm .box-modern-icon { opacity:1;}
.box-modern-text { text-align:center; font-size:16px; font-weight:bold; color: #dddcdc;}
.box-modern-icon {position: relative; z-index: 2;  right: -5%;  font-size: inherit;  color: #6090f7; opacity: .7;}
.footer-top{  width: 100%; float: left; padding: 20px 0;background-image: url(../images/footer-patterns.png);   background-position: 0 0;   background-color:#101f26;  background-repeat: no-repeat; padding-top: 15px; padding-left: 15px;  padding-right: 15px; }
.customer-hpnl-support-footer {  width:29%;   float: left;  margin: 30px 20px;}
.footer-top h4 {  color: #fff !important;  border-bottom: 1px dotted #282828;   font-size:17px;  padding-bottom: 10px;   margin-bottom: 20px; font-family: 'Montserrat', sans-serif;  letter-spacing: 1px;}
.customer-hpnl-support-footer ul { width: 100%;  float: left;}
.con li img{ width: 12%;padding-right: 10px;}
.customer-hpnl-support-footer ul li {  padding: 7px 0;  color: #d1d1d1;   letter-spacing: 0.5px;}
.customer-hpnl-support-footer ul {  width: 100%;  float: left;}
.footer-follow-hpnl {  width: 96%;  float: left;  padding: 10px;}
.customer-hpnl-support-footer ul li {  padding: 7px 0;  color: #d1d1d1;list-style: none;  letter-spacing: 0.5px;border-bottom:1px solid #1c2931;}
.footer-follow-hpnl li { list-style: none;   display: inline-block;  padding:5px 0px !important;  color: #bbb;  margin: 0 0px 0px 0px;  border-radius: 2px; text-align:center;}
.customer-hpnl-support-footer ul li a {  text-decoration: none;  color: #fff;   padding: 10px 0;   text-decoration: none;  color:#7c7980;  font-size:14px;}
.footer-follow-hpnl li a {   text-decoration: none;  color: #87cde4;}
.customer-ul{padding:8px 0;}
.customer-side-cover{ width:100%; float:left;padding: 30px 0; }
.customer-ul li{ list-style:none; padding:7px 0px 7px 0px;  border-bottom: 1px dashed #ccc;}
.customer-ul li:before {  -webkit-border-radius: 4px; -moz-border-radius: 4px;  border-radius: 4px;   content: "";float: left;  height:8px;   background-color: inherit;  margin:5px 10px;   width:8px;  border: 2px solid #d43b3b;  background: #ffffff;}
.services-bottom{text-align:center;  padding-bottom: 7px; font-weight: 500;}
.services-bottom  h1{color: #000; font-size:22px;  font-weight: bold; font-family: "Raleway",sans-serif;}
.customer-left-side{ width:75%; float:left;}
.customer-right-side{ width:50%; float:right}
.hpnl-service-client-cover-all p{ text-align:justify;}
.top{background:#0e0d0c; padding: 8px 0 29px 0;  font-family: 'Open Sans',sans-serif;}
.col-sm-5 { width: 41.66666667%; float:left}
.top-list-right { width: 58.33333333%;  float: right; text-align:right;}
.col-sm-5 ul{ width:100%;}
.col-sm-5 ul li{ display:inline-block; list-style:none;width: 6%;}
.col-sm-7 ul li a{ }
.col-sm-7 ul{ width:100%;}
.col-sm-7 ul li{ display:inline-block; list-style:none;padding-right: 10px;}
.col-sm-7 ul li a{ color: #fff;}
.col-sm-5 li  img{  width:65%;}
.customer-more { width:100%; float:left;  padding-top: 50px;  padding-bottom: 90px;  background: #f1f1f1; text-align:center;}
.customer-more2{    margin-top: -80px;   width: 100%; float: left;padding: 0px 0 70px 0;}
.customer-more2-box{ width:33%; float:left;}
.customer-more2-box figure {  width: 165px; height: 165px;  background:url(../images/kv1.png) center center no-repeat;  margin-left: auto;   margin-right: auto;  position: relative;  transition: all 0.3s ease-out;  -moz-transition: all 0.3s ease-out;  -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;}
.customer-more2-box figure img {  display: block;   margin-left: auto; margin-right: auto;  padding-top: 38px;}
.customer-more2-box .caption {   text-align:center;   position: relative;}
.customer-more2-box .caption .txt1 {  font-size: 24px; color: #000d1e;}
.customer-more2-box .caption .txt2 {   color: #47586e;}
.hpnl-service-client-one-side-tx{ width:100%; float:left; padding:30px 0; background:#2f538a; background-size: cover;}
.hpnl-service-client-one-side-tx-left{ width:50%; float:left;}
.hpnl-service-client-one-side-tx h2{font-size:20px;color:#fff;}
.hpnl-service-client-one-side-tx-left h2{ font-size:20px;color:#fff; }
.hpnl-service-client-one-side-tx p{ color:#bdbdbd;}
.customer-more2-box:hover{ padding-top:5px;}
.hpnl-serv{ width:100%; float:left; padding:20px 0 20px; position:relative}
.hpnl-site-left{ width:50%; float:left;}
.hpnl-site-right{ width:50%; float:right;position: relative; padding: 0px 0px 0px 25px;}
.featured-service {  margin: 0;  width: 100%; float: left}
.featured-service-outer {  padding: 0 0 0 0;  background-color: #2f538a;}
.featured-service .col-md-3 {  padding: 0;}
.wd-20 {   width: 13%; float:left}
.featured-service .man-img {  width: 246px;}
.featured-service .man-img img {   position: relative;   z-index: 2;   left: -44px;   top: 0px;   right: 0;}
.wd-28 { width: 28%; float:left;}
.featured-service-block { padding: 45px 20px 60px 20px;  position: relative; background: #2f538a;  text-align:center;   margin-top: 103px; height: 294px;  border-right: 1px solid #1F477B;}
.featured-service-block .icon-holder {  line-height: 35px;  margin-bottom: 18px;}
.featured-service-block h3 {  color: #fff; padding-bottom: 20px; text-transform: uppercase; font-size: 18px;}
.featured-service-block p {  color: #fff;  padding: 0 20px;}
.contact-area {  width: 100%; float:left;  background-color: #2f538a;  padding: 22px 0 22px;  height: 182px;  margin-top:110px;}
.col-md-3 { width: 25%; float:left;    position: relative; min-height: 1px;  padding-right: 15px;  padding-left: 15px;}
.contact-area .img-holder img {  top: -124px;  position: absolute;}
.col-md-7 {  width:63.33333333%; float:left}
.contact-area .cntct-info { width: 100%;}
.contact-area .cntct-info h4 {  font-size: 28px;  padding-top: 30px;   font-weight: 700;   color: #fff;   font-style: italic;}
.contact-area .cntct-info p {  color: rgba(255, 255, 255, 0.5);  padding-top: 10px; font-family: "PT Serif",sans-serif; font-style: italic;   font-size: 16px;}
.banner-internal-tx {color:#f7f7f7;padding: 175px 0 70px;font-size: 39px;text-align:left;}
.col-md-2 {  width: 16.66666667%; float:left;}
.contact-area .btn-col {   padding-top: 30px;}
.contact-area .btn-col .btn-lg { padding: 15px 35px; line-height: 40px; font-size: 15px;  font-weight: 400; border: 1px solid #FFF;  background-color: transparent; border-radius: 0;  color: #FFF;}
.single-service-cover{width:33%; float: right; padding: 10px 20px; min-height:130px;  text-align: right;  margin-bottom: 10px;}
.single-service-cover{ box-shadow: 0px 12px 36px 10px rgba(0,0,0,0.05);}
.ac{padding-left:10px; box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.05);background: #edf7ff;}
.single-service-cover:hover{ box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.05);}
.srvc-content-side p a{ color:#888}
.services-top-right-cover{ width:100%; float:left; padding-bottom:20px; text-align:left}
.hpnl-contact-page-cover{ width:100%; float:left; background:#f0faff;    padding:20px 40px;}
.col-md-4 { width: 40%; float:left}
.abt-left-thumb {   display: block;   position: relative;  z-index: 1;  box-shadow: 0px 0px 21px rgba(0,0,0,0.3);}
.col-md-5 { width:40%; float:left}
.col-md-6 { width:60%; float:right}
.heading-tx{ margin-top:20px;}
.abt-left-thumb img {  border-radius: 4px;  overflow: hidden; max-width: 100%;}
.offset-md-1 {  margin-left:0;}
.col-md-7 {     width: 60%; float:right;}
.srvc-content p a{ color:#1294d4;}
.hpnl-serv p a{color:#1294d4;}
.hpnl-bg-top{ width:100%; float:left; padding:50px 0; background:url(../images/hpnl-bg-banner.jpg) top center no-repeat; background-size:cover}
	.fixed-background, .s-parallax {
    background-attachment: fixed;
    background-position: 50% 0;
}
.s-parallax, .cover-image, .cover-background, .texture-background {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
.ds { background-color: #000;  color: #aeb1b4;}
.center { text-align:center !important;}
.hpnl-bg-top h1{ color:#fff;text-align:center}
.hpnl-bg-top h2{ color:#fff;text-align:left;     font-weight: normal;}
.hpnl-bg-top p { color:#c0b9b9;text-align: justify; font-size: 15px;}
.hpnl-bg-top p a{ color:#ffa12f;}
.top-bg-content-area{ width:100%; float:left; background:#fff; padding:20px 40px 40px 40px; margin-top: -33px; position: relative; box-shadow: 0px 3px 3px 0px rgba(75, 81, 91, 0.18); margin-bottom: 70px; font-size: 16px;}
.top-bg-content-area p {  display: inline-block;}
.top-bg-content-area h1 {font-family: "Poppins", sans-serif; color:#008ccd; text-align: center;font-size: 23px; }
.top-bg-content-area h2, h3 {font-family: "Poppins", sans-serif;color:#008ccd;font-size: 21px;padding:8px 0;}
.hpnl-bg-top h3 { color:#fff;}
.colo { color:#c0b9b9 !important;}
.recos-support-four-boxes-one p {
  color: #ccc;
  text-align: center;
  padding-top: 10px;
  font-size: 14px;
}
.hpnl-bg-ul {
  width: 100%;
  padding: 5px;
}

.hpnl-bg-ul li {
  padding-bottom:5px;
  font-size: 16px;
  padding-top:5px;
  list-style: none;
  position: relative;
  border-bottom: 1px dashed #ededed;
}

.hpnl-bg-ul li::before {
  content: "";
  font-family: 'FontAwesome';
  margin-right: 10px;
  height: 7px;
  width: 7px;
  background:#38a5d3;
  display: inline-block;
  transform: rotate(-45deg);
}

/*---------------iPad portrait---------------*/
@media only screen and (min-width: 768px) and (max-width: 1200px) {.container {width:100%;}
.services-full-four-li { position: absolute; bottom: 65px; left: 10%;}
.services-full-four-li { bottom: 65px;}
#hpnlmenu ul { float: left; padding: 13px 0;}
.hpnl-mail-txt{ width:43%; bottom:58%;}
.hpnl-mail-tx{ width: 62%; bottom: 51%;;}
.reco-support-four-boxes-one { width: 23%;}
.col-md-4 img{ width:100%;}
.col-md-7 img {   width:100%;}
.customer-hpnl-support-footer ul li a { font-size: 11px;}
.text{ width:50%;}
.col-md-777 img{  width:100%;}
	}
/*---------------iPad portrait---------------*/
@media only screen and (min-width: 768px) and (max-width: 1000px) {
	.container {width:100%;}
	.services-full-four-li {  bottom: 20px;}
	.customer-hpnl-support-footer ul li a {font-size:8px;}
	.text { font-size: 17px; padding: 8px 12px; bottom: 43%;  left: 10%;}
	.grid figure {  width: 32%;}
	.hpnl-mail-tx{ width:87%;}
	.hpnl-mail-txt{ width: 69%;  bottom: 41%;;}
	figure.effect-ming h2 { margin: 20% 0 0px 0;}
	figure.effect-ming p { padding: 0px;}
	.rr-all-boxes { padding: 30px 0 0px;}
	.col-md-7 img{ width:100% }
	.customer-hpnl-support-footer {  margin: 30px 12px;}
	.banner-internal { margin-top: 20px;}
	.hpnl-mail-tx{ font-size: 24px;  bottom: 53%;}
	.srvc-content h1 { font-size: 20px !important;}
	.text{ width:89%; bottom:37%; font-size:15px; display:none;}
	.contact-area .cntct-info h4{ font-size:22px;}
	.top-bg-content-area {   margin-top: -32px;}
	.contact-area .btn-col .btn-lg {  padding: 14px 20px;  font-size: 15px;}
	}

/*---------------iPhone landscape---------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.container {width:100%;}
	.slideshow-container {   max-width: 100%;   position: relative;    margin:0px 0 0 0;}
.hpnl-mail-tx { font-size: 22px; bottom: 45%; padding-left: 10%;}
.text {  font-size: 12px; bottom:30%; left: 4%; display:none;}
.srvc-content { width: 100%;  padding: 20px 0;}
.single-service { width: 100%;}
.serv {  width: 100%;}
.srvc-content-side { width: 100%;  padding-left:0px;}
.services-top-right {  width: 100%; margin-top:10px}
.customer-left-side { width: 100%;}
.customer-right-side { width: 100%;}
.rr-all-boxes {width: 100%; padding: 20px 0 20px;}
.grid { padding: 1em 0 0em;}
.customer-hpnl-support-footer { width: 100%;  margin: 10px 0px;}
.footer-follow-hpnl li { padding: 5px 5px !important;}
.banner-internal { min-height: 100px; margin-top: 68px;}
.banner-internal-tx {  padding-top: 36px; font-size: 29px;}
.hpnl-contact-page-left {  width: 100%;  padding: 20px 0;}
.hpnl-contact-page-right { width: 100%; padding: 20px 0;}
.hpnl-contact-page {  padding: 20px 0 10px 0;}
.social-link a { margin-right: 3px;}
header { padding: 12px 0; height: 69px;}
.bg-tx { margin-bottom: 10px;}
.services-full-four-li { display: none;}
figure.effect-ming img {  width: 100%;}
.mySlides img { width: 100%; margin-top: 14px;}
.col-sm-5 { display: none;}
.top-list-right { width: 100%;  float: left;  text-align: left;}
.col-sm-7 ul li { font-size:9px; padding-right:0px;}
  .text2 { color: #fff; font-size: 13px; padding: 3px 19px;  position: absolute;  bottom: 6%;  text-align:center;  left: 40%; width: auto;  border-radius: 30px;  background: #ffbd0f;}
.hpnl-mail-tx {font-size: 17px; bottom: 49%; padding-left: 10%; width: 84%; left: -7%;}
.customer-more { width: 100%; padding-top: 14px;}
.services-bottom h1 { line-height: 26px;}
.customer-more2-box {  width: 100%;}
.customer-left-side img{  width: 100%;}
.hpnl-service-client-one-side-tx-left {  width: 100%;}
.text{ width:95%;}
.customer-more2{ padding:0px 0 20px 0;}
.hpnl-mail-txt{ width:87%; font-size:14px; bottom:37%; left:3%;}
.rb-call{ height:40px; top: 69%; left: 0%; margin:0 0 0px 17px;}
.rb-call a{ top:-12%;}
.wd-28 {  width: 100%; float: left;}
.featured-service .man-img {width: 100%;}
.wd-20 {  width:100%;}
.featured-service .man-img img { position: relative;   z-index: 2; left: 0;  top: 0px;  right: 0;}
.featured-service-block {   margin-top: 10px;}
.hpnl-site-left {  width: 100%; float: left;}
.hpnl-site-right {  width: 100%;  float: right;}
.col-md-7 { width:100%; -webkit-box-flex: 0; -ms-flex: 0 0 100%;  flex: 0 0 100%;  max-width: 100%;}
.contact-area .cntct-info h4 { font-size: 16px;}
.col-md-2 { width: 100%; float: left;}
.contact-area .btn-col {  padding-top:0px;}
.contact-area {  width: 100%; float: left; padding: 0px 0 0px;  height: 143px;margin-top: 110px;}
.col-md-3 { width: 43%;}
.contact-area .img-holder img { left: -2%;}
.services-top { font-size: 8px; line-height: 22px;}
.footer p { font-size: 12px; color: #c1c1c1;}
.customer-hpnl-support-footer ul li a {font-size:9px;}
.customer-hpnl-support-footer ul li { padding: 4px 0; font-size: 11px;}
.customer-hpnl-support-footer ul li img {padding:0px;}
.hpnl-service-client-cover-all { padding: 10px 0;}
.tx-contact-ul li { font-size: 9px;}
.post-date { padding: 5px 0;}
.single-service-cover { width: 100%;}
.hpnl-serv { padding: 20px 0 30px;}
.single-service {  padding: 20px 20px 30px 20px;}
.offset-md-1 { margin-left: 0%;}
.col-md-4 { width:100%; -webkit-box-flex: 0; -ms-flex: 0 0 100%;  flex: 0 0 100%;  max-width: 100%;}
.logo { padding-top: 0px;}
.abt-left-thumb:before {  content: '';  position: absolute;  right: 0px;  bottom: 0px;  border: 2px solid #f3f2f2; height: 100%; width: 100%; z-index: -1;  border-radius: 0px 0px 30px 0px;}
.col-md-4 { margin-bottom: 20px;}
.srvc-content h1 { font-size: 14px !important; font-family: "Raleway",sans-serif;  line-height: 23px;}
.gap-point {  padding-bottom: 30px !important;}
.hpnl-bg-top h1 { font-size: 18px; padding-bottom:10px}
.hpnl-bg-top {  padding: 20px 0;}
.abt-left-thumb img {  width: 100%;}
.col-md-7 img { width:100%;}
.top-bg-content-area { padding: 15px 20px 20px 20px;  margin-top: -21px;}
.top-bg-content-area h1 { font-size:16px;}
.hpnl-bg-top { padding: 20px 0;}
.reco-support-four-boxes-one {  width:100%;}
.col-md-4 img { width:100%;}
.bg-tx {font-size: 18px;}
.col-md-444 {  width: 100%;}
.col-md-777 {  width:100%;}
.col-md-777 img{  width:100%;}
    .banner-front {
  width:100%;
margin-bottom: 0%;
  text-align:center;}
    .banner-inner { padding-bottom:9%}
    .footer-top {
  padding: 0px 0;
  background-image: none;}
    .reco-support-four-boxes-one {
  width: 50%;
}
 .call-now { float: none;}
	}

/*---------------iPhone portrait---------------*/
@media only screen and (min-width: 320px) and (max-width: 479px) {
	.container {width:100%;}
.slideshow-container { max-width: 100%; position: relative; padding-top: 53px; margin: 0px 0 0 0;}
.hpnl-mail-tx { font-size: 22px; bottom: 45%; padding-left: 10%;}
.text {  font-size: 12px; bottom: 23%; left: 4%;}
.srvc-content { width: 100%;  padding: 20px 0;}
.single-service { width: 100%;}
.serv {  width: 100%;}
.srvc-content-side { width: 100%;  padding-left:0px;}
.services-top-right {  width: 100%; margin-top:10px}
.customer-left-side { width: 100%;}
.customer-right-side { width: 100%;}
.rr-all-boxes {width: 100%; padding: 20px 0 20px;}
.grid { padding: 1em 0 0em;}
.customer-hpnl-support-footer { width: 100%;  margin: 10px 0px;}
.footer-follow-hpnl li { padding: 5px 5px !important;}
.banner-internal {min-height: 130px; margin-top: 0px;}
.banner-internal-tx {  padding:83px 0 0px;font-size: 19px;text-align: center;}
.hpnl-contact-page-left {  width: 100%;  padding: 20px 0;}
.hpnl-contact-page-right { width: 100%; padding: 20px 0;}
.hpnl-contact-page {  padding: 20px 0 10px 0;}
.social-link a { margin-right: 3px;}
header { padding: 12px 0;height: 68px;}
.bg-tx { margin-bottom: 10px;}
.services-full-four-li {  display: none;}
.mySlides img { width: 100%; margin-top:-2px; }
.col-sm-5 { display: none;}
.top-list-right { width: 100%;  float: left;  text-align: left;}
.col-sm-7 ul li { font-size:9px; padding-right:0px;}
  .text2 { color: #fff; font-size: 13px; padding: 3px 19px;  position: absolute;  bottom: 6%;  text-align:center;  left: 40%; width: auto;  border-radius: 30px;  background: #ffbd0f;}
  .hpnl-mail-tx {font-size: 13px; bottom: 45%;  padding-left: 0;  line-height: 23px;  width: 87%; left: 6%}
.customer-more { width: 100%; padding-top: 14px;}
.services-bottom h1 { line-height: 26px;}
.customer-more2-box {  width: 100%;}
.customer-left-side img{  width: 100%;}
.hpnl-service-client-one-side-tx-left {  width: 100%;}
.text{ width:95%; display:none;}
.customer-more2{ padding:0px 0 20px 0;}
.hpnl-mail-txt{ width:87%; font-size:14px; bottom:35%;left: 6%;}
.rb-call{ height:34px; left:0%; margin:0 0 0px 17px;top: 70%;background: #1976d2;}
.rb-call a{ top:-27%;}
.wd-28 {  width: 100%; float: left;}
.featured-service .man-img {width: 100%;}
.wd-20 {  width:100%;}
.featured-service .man-img img { position: relative;   z-index: 2; left: 0;  top: 0px;  right: 0;}
.featured-service-block {   margin-top: 10px;}
.hpnl-site-left {  width: 100%; float: left;}
.hpnl-site-right {  width: 100%;  float: right;}
.col-md-7 { width: 100%; flex: 0 0 100%; max-width: 100%;}
.contact-area .cntct-info h4 { font-size: 16px;}
.col-md-2 { width: 100%; float: left;}
.contact-area .btn-col {  padding-top:0px;}
.contact-area {  width: 100%; float: left; padding: 0px 0 0px;  height: 143px;margin-top: 110px;}
.col-md-3 { width: 43%;}
.contact-area .img-holder img { left: -2%;}
.services-top { font-size: 8px; line-height: 22px;}
.footer p { font-size: 12px; color: #c1c1c1;}
.customer-hpnl-support-footer ul li a {font-size:9px;}
.customer-hpnl-support-footer ul li { padding: 4px 0; font-size: 11px;}
.customer-hpnl-support-footer ul li img {padding:0px;}
.hpnl-service-client-cover-all { padding: 10px 0;}
.tx-contact-ul li { font-size:11px;}
.post-date { padding: 5px 0;}
.single-service-cover { width: 100%;}
.hpnl-serv { padding: 20px 0 30px;}
.single-service {  padding: 20px 20px 30px 20px;}
.offset-md-1 { margin-left: 0%;}
.col-md-4 { width:100%; -webkit-box-flex: 0; -ms-flex: 0 0 100%;  flex: 0 0 100%;  max-width: 100%;}
.logo { padding-top: 0px;}
.abt-left-thumb:before {  content: '';  position: absolute;  right: 0px;  bottom: 0px;  border: 2px solid #f3f2f2; height: 100%; width: 100%; z-index: -1;  border-radius: 0px 0px 30px 0px;}
.col-md-4 { margin-bottom: 20px;}
.srvc-content h1 { font-size: 14px !important; font-family: "Raleway",sans-serif;  line-height: 23px;}
.gap-point {  padding-bottom: 30px !important;}
.hpnl-bg-top h1 { font-size: 18px; padding-bottom:10px}
.hp-bg-top {  padding: 20px 0;}
.col-md-7 img { width:100%;}
.top-bg-content-area { padding: 15px 20px 20px 20px;  margin-top: -21px;}
.top-bg-content-area h1 { font-size:16px;}
.hpnl-bg-top { padding: 20px 0;}
.reco-support-four-boxes-one {  width:50%;}
.col-md-4 img { width:50%;}
.bg-tx {font-size: 18px;}
.logo{ width:50%;}
.logo img{ width:100%;}
.footer-top { padding: 0px 0;background-image: none;}
.col-md-444 {  width: 100%;}
.col-md-777 {  width:100%;}
.col-md-777 img{  width:100%;}
.call-now { width: 35%;  margin: 1% auto 1% auto;padding: 10px 25px; float: none;}
    .text-system {font-size: 23px;padding-top: 20px; }
    .banner {
  padding-top:23%;
}
.banner-front {
  width:100%;
margin-bottom: 0%; margin-top:8%;
  text-align:center;}
    .banner-inner { margin-top: 12%; padding-bottom:9%}
	}