@import url("rootvariable.css");
@import url("custom-margin-padding.css");

/*@font-face {
  font-family: 'Ddin';
  src: url('../fonts/D-DIN.otf');
  font-style: normal;
}
@font-face {
  font-family: "Ddin-bold";
  src: url('../fonts/D-DIN-Bold.otf');
  font-Feight: bold;
}
@font-face {
  font-family: "Ddin-italic";
  src: url('../fonts/D-DIN-Italic.otf');
  font-style: italic, oblique;
}*/

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--century-font-famlily);
  font-size: 17px;
  overflow-x: hidden;
  width: 100%;
}

/* Common CSS */
/* ==============================Text Selection Color===================================== */
::selection {
    background: var(--background-patch);
    color: #fff;
    text-shadow: none;
}
::-moz-selection {
    background: var(--background-patch);
    /* Firefox */
    color: #fff;
    text-shadow: none;
}
::-webkit-selection {
    background: var(--background-patch);
    /* Safari */
    color: #fff;
    text-shadow: none;
}
/*------------- #Styles for Text Selection --------------*/

/* ===============================Container Spacing  Classes=========================================*/
.containspacing { padding: 15px 0px; }
.containspacing1 { padding: 30px 0px; }
.containspacing2 { padding: 50px 0px; }
.containspacing3 { padding: 100px 0px; }
.containspacing-t-b { padding-top: 30px; padding-bottom: 50px; }
/* ===============================Container Spacing  Classes End=========================================*/

/* Common CSS */
.blackcolor {
  color: #000 !important;
}
.webbluecolor {
  color: #014d89 !important;
}
.background-patch {
  background: var(--background-patch);
}
.background-patch1 {
  background: #014d89;
}
.heading-top {
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 40px;
}
.page-title {
  color: #014d89;
  font-size: 18px;
}
.mandatory {
  color: red;
}
.font-size-20 {
  font-size: 20px;
}
.text-decoration-underline {
  text-decoration: underline;
}
.display-none {
  display: none !important;
}
/* Common CSS */

.topheader {
  background-color: #014d89;
  color: #fff;
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.topheader p {
  margin: 0;
}
.topheader p a {
  color: #fff;
  transition: all 0.4s;
}
.topheader p a:hover {
  text-decoration: none;
}
.topheader p a {
  display: inline-block;
  margin-right: 10px;
}
.topheader p a i:last-child {
  margin-right: 0;
}
.topheader .sss{
  display : none;
}
.topheader .sxs {
  display: none;
}
/*button animation*/

.topheader .sidebtn h3{
  position: fixed;
  left: -5%;
  display:inline-block;
  top: 50%;
  z-index: 1000;
  background: #ed1f24;
  border: 1px solid #ed1f24;
  -webkit-transform: rotate(-90deg); 
  -moz-transform: rotate(-90deg);    
  transform:rotate(-90deg);
  font-size: 25px !important;
  /*background: #0b1080;*/
  color: #fff !important;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 5px;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  font-size: 13px;
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}
.topheader .sidebtn h3:before {
  content: '';
  display: block;
  width: 0px;
  height: 86%;
  position: absolute;
  top: 7%;
  left: 0%;
  opacity: 0;
  background: white;
  box-shadow: 0 0 15px 5px white;
  -webkit-transform: skewX(-20deg);
  -moz-transform: skewX(-20deg);
  -ms-transform: skewX(-20deg);
  -o-transform: skewX(-20deg);
  transform: skewX(-20deg);
  -webkit-animation: shine 1.5s 0s infinite;
  -moz-animation: shine 1.5s 0s infinite;
  animation: shine 1.5s 0s infinite;
}
@-webkit-keyframes shine {
  from {
    opacity: 0;
    left: 0%;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    left: 100%;
  }
}
@-moz-keyframes shine {
  from {
    opacity: 0;
    left: 0%;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    left: 100%;
  }
}
@keyframes shine {
  from {
    opacity: 0;
    left: 0%;
  }
  50% {
    opacity: 1;
  }
  to {
    opacity: 0;
    left: 100%;
  }
}
.topheader .relative{
  position: relative;
}
.topheader .hover{
  position: fixed;
  margin-left: 35px;
  min-height: auto;
  border-bottom-right-radius: 4px;
  border-top-right-radius: 5px;
  line-height: 30px;
  background-color: #014d89;
  left: 0%;
  top: 40%;
  width: 450px;
  visibility: hidden;
  margin-top: 60px;
  z-index: 1000;
}
.topheader .hover .bor-left{
  border-left: 2px solid #fff;
}
.topheader .hover p{
  padding-left: 8px;
  margin-top: 8px;
  margin-bottom: 15px;
  text-align: center;
}
.topheader .hover a{
  background-color: #ed1f24;
  border-radius: 5px;
  text-align: center;
  padding: 0 5px;
  transition-duration: 0s;

}
.topheader .hover h3{
  z-index: inherit;
}
.topheader .sidebtn:hover .hover{
  visibility: visible;
}
.topheader .sidebtn-right{
  position: fixed;
  right: -5%;
  display:inline-block;
  top: 50%;
  z-index: 1000;
  color: #fff;
  background-color: #014d89;
  border: 3px solid #014d89;
  -webkit-transform: rotate(90deg); 
  -moz-transform: rotate(90deg);    
  transform:rotate(90deg);
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  font-size: 13px;
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}
.topheader .sidebtn-right:before{
  content: '';
  display: block;
  width: 0px;
  height: 86%;
  position: absolute;
  top: 7%;
  left: 0%;
  opacity: 0;
  background: white;
  box-shadow: 0 0 15px 5px white;
  -webkit-transform: skewX(-20deg);
  -moz-transform: skewX(-20deg);
  -ms-transform: skewX(-20deg);
  -o-transform: skewX(-20deg);
  transform: skewX(-20deg);
  -webkit-animation: shine 1.5s 0s infinite;
  -moz-animation: shine 1.5s 0s infinite;
  animation: shine 1.5s 0s infinite;
}
.topheader .sidebtn-right:hover{
  background-color: #fff;
  color: #014d89;
}
.topheader .modal.right .modal-dialog {
		position: fixed;
		margin: auto;
		width: 320px;
		height: 100%;
    max-height: 480px;
    top: 10%;
		-webkit-transform: translate3d(0%, 0, 0);
		-ms-transform: translate3d(0%, 0, 0);
		-o-transform: translate3d(0%, 0, 0);
		transform: translate3d(0%, 0, 0);
	}
.topheader .modal.right .modal-content {
		height: 100%;
		overflow-y: auto;
    margin-bottom: 0;
	}
.topheader .modal.right .modal-body {
		padding: 15px 15px;
	}
/*Right*/
.topheader .modal.right.fade .modal-dialog {
  right: -320px;
  -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
  -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
  -o-transition: opacity 0.3s linear, right 0.3s ease-out;
  transition: opacity 0.3s linear, right 0.3s ease-out;
}

.topheader .modal.right.in .modal-dialog {
  right: 0;
}
/* ----- MODAL STYLE ----- */
.topheader .modal-content {
  border-radius: 0;
  border: none;
}
.topheader .modal-body textarea{
  height: 40px;
}
.topheader .modal-body h2{
  font-size: 24px;
}
.topheader .modal-content button{
  color:  #000;
  padding-right: 3px;
  padding-left: 3px;
  z-index: 1020;
}
.topheader .modal-content .submitbtn{
  padding-top: 5px;
  margin-top: 5px;
  padding-bottom: 5px;
  margin-bottom: 5px;
}
.topheader .modal-content button.close{
  z-index: 1020;
}
/* media query */
@media (max-width: 990px){
  .topheader .sls{
    display: none;
  }
  .topheader .sss {
    display: block;
    text-align: center;
  }
  .topheader .sidebtn h3{
    left: -8%;
  }
}
@media (max-width: 576px){
  .topheader .sss{
    display :none;
  }
  .topheader .sxs {
    display: block;
    text-align: center;
  }
  .topheader .sidebtn h3{
    left: -13%;
  }
}

/* media query end */

.videosection {
  position: relative;
}
.videosection .navbar-abs {
  position: absolute;
  top: 0;
  width: 100%;
  background: #ffffff73;
  padding-top: 10px;
  padding-bottom: 10px;
  z-index: 99;
}
.videosection .navbar-abs.simple-navbar {
  position: relative;
  background: #99b8d0;
}
.videosection .navbar-abs .navbar-inverse {
  background: transparent;
  border-color: transparent;
  margin: 0;
}
.videosection .navbar-abs .navbar-inverse .navbar-nav>li>a {
  color: #fff;
  font-size: 20px;
  letter-spacing: 1px;
  text-shadow: 1px 1px 5px #000;
}
.videosection .navbar-abs .requestproposal {
  text-align: right;
}
.videosection .navbar-abs .requestproposal a {
  background: #014d89;
  display: inline-block;
  color: #fff;
  padding: 5px 18px;
  font-size: 15px;
  letter-spacing: 1px;
  border-radius: 5px;
  border: 1px solid #014d89;
}
.videosection .navbar-abs .requestproposal .rasp  {
  background: #ed1f24;
  border: 1px solid #ed1f24;
}
.videosection .navbar-abs .requestproposal a:hover {
  text-decoration: none;
}
.modal-backdrop{
  z-index: 0 !important;
}
.videosection .modal-content{
  background: #fff;
}
.videosection .modal-content button{
  color:  #000;
  padding-right: 3px;
  padding-left: 3px;
  z-index: 1000;
}
.videosection .modal-content button.close{
  z-index: 20;
}
.videosection .modal-body{
  border: 1px solid #014d89;
  margin: 20px;
  border-radius: 10px;
  padding: 10px;
}
.videosection .modal-body h2{
  font-size: 30px;
  line-height: 35px;
  text-align: center;
  color: #014d89;
}
.videosection .modal-body input{
  border: 1px solid #014d89;
  border-left: none;
  border-radius: 4px;
}
.videosection .modal-body select{
  border: 1px solid #014d89;
  border-left: none;
  border-radius: 4px;
}
.videosection .modal-body textarea{
  border: 1px solid #014d89;
  border-radius: 4px;
  resize: none;
}
.videosection .modal-body .input-group-addon{
  background-color: #fff;
  border: 1px solid #014d89;
  border-right: none;
  color: #014d89;
}
.videosection .modal-body .submitbtn{
  color: #fff;
  background-color: #ed1f24;
  border: none;
  padding: 10px;
  margin-bottom: 10px;
}
.videosection .modal-body .submitbtn:hover{
  color: #ed1f24;
  border: 2px solid #ed1f24;
  background-color: #fff;
}
.videosection .modal-body .form-check{
  width: 50%;
}
.videosection .modal-body .form-check .form-check-input{
  border: 1px solid #014d89;
  background-color: #014d89;
}
.videosection .dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0; 
}
.videosection .dropdown-menu{
  min-width: 800px;
  margin-top: 8px !important;
  right: -350px;
  background: #014d89;
  border-color: transparent;
}
.videosection .navbar .sd{
  display: none;
}
.videosection .navbar-abs .collapse .navbar-inverse .open a:focus{
  background-color: #014d89 !important;
}
.videosection .dropdown-menu .col-md-3>ul>li>a{
  color: #fff;
  font-size: 14px;
  text-shadow: 1px 1px 5px #000;
}
.videosection .dropdown-menu .col-md-3>ul>li>a:hover{
  text-decoration: none;
}
.videosection .dropdown-menu .col-md-3 p{
  padding-left: 10px;
  color: #fff;
  font-size: 18px;
  text-shadow: 1px 1px 5px #000;

}
.videosection .dropdown-menu .col-md-3>ul{
  padding-left: 15px;
}
.videosection .dropdown-menu .col-md-3>ul>li{
  list-style: none;
}
.videosection .navbar-header button{
  display: none;
  background: none;
  padding-bottom: 8px;
  padding-top: 5px;
  color: #024d89;
  border: none;
}
/* icon animation*/
.videosection .animated-icon2{
  width: 30px;
  height: 20px;
  position: relative;
  margin: 0px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}
.videosection .animated-icon2 span{
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  background: #024d89;
}
.videosection .animated-icon2 span:nth-child(1) {
  top: 0px;
  }
  
.videosection  .animated-icon2 span:nth-child(2), .animated-icon2 span:nth-child(3) {
  top: 10px;
  }
  
  .videosection .animated-icon2 span:nth-child(4) {
  top: 20px;
  }
  
  .videosection .animated-icon2.open span:nth-child(1) {
  top: 11px;
  width: 0%;
  left: 50%;
  }
  
.videosection .animated-icon2.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  }
  
  .videosection .animated-icon2.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  }
  
  .videosection .animated-icon2.open span:nth-child(4) {
  top: 11px;
  width: 0%;
  left: 50%;
  }
/* icon animation end*/

/*media query*/
@media (max-width: 1200px){
  .videosection .navbar-abs .navbar-inverse .navbar-nav>li>a{
    padding: .5vw;
  }
}
@media (max-width: 990px){
  .videosection .navbar-abs .requestproposal a{
    text-align: center;
    font-size: 1.5vw;
  }
  .videosection .navbar-abs .navbar-inverse .navbar-nav>li>a {
    font-size: 2vw;
  }
}

@media (max-width: 768px){
  .videosection .navbar-abs .img-responsive{
    width: 65%;
    margin-left: auto;
    margin-right: auto;
  }
  .videosection .navbar{
    height: 0;
    min-height: 0;
  }
  .videosection .navbar .container-fluid{
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .videosection .navbar-abs{
    position: static;
  }
  .videosection .navbar-header button{
    display: block;
    bottom: 100%;
    position: absolute;
    right: 5%;
    z-index: 1000;
    margin-bottom: 2.8vw;
  }
  .videosection .navbar-abs .requestproposal{
    width: 66%;
    float: right;
  }
  .videosection .navbar-header{
    float: right;
  }
  .videosection .navbar-abs .requestproposal{
    display: none;
  }
  .videosection .navbar-collapse{
    background: #fff;
    text-align: center;
    z-index: 1000;
    position: static;

  }
  .videosection .mobnav{
    width: 100%;
  }
  .videosection .navbar-abs .navbar-inverse .navbar-nav>li>a{
    color: #000;
    text-shadow: none;
    text-align: left;
    padding-left: 20px;
    font-size: 16px;
    z-index: 1000;
  }

  .videosection .navbar .lg{
    display: none;
  }
  .videosection .navbar .sd{
    display: block;

  }
  .videosection .navbar #collapseExample{
    z-index: 1000;
    padding-left: 40px;
    
  }
  .videosection .navbar #collapseExample li a{
    text-align: left;
    display: block;
    color: #000;
    z-index: 1000;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .videosection .navbar #collapseExample1,.videosection .navbar #collapseExample2,.videosection .navbar #collapseExample3,.videosection .navbar #collapseExample4{
    padding-left: 20px;
    font-size: 14px;
  }
}

@media (max-width:576px){
  .videosection .navbar-header button{
    margin-bottom: 2vw;
  }
}
/* media query end*/

.videosection video {
  width: 100%;
  /*height: 400px;*/
}
.bannertext-abs {
  position: absolute;
  bottom: 50px;
  width: 100%;
  text-align: center;
}
.bannertext-abs .textsec h3 {
  font-size: 30px;
  color: #ed1f24;
  font-weight: 700;
}
.bannertext-abs .textsec p {
  font-size: 20px;
  /*color: #014d89;*/
  color: #fff;
}

.mainservices .services-row {
  display: flex;
}
.mainservices .services-row::after, .mainservices .services-row::before {
  content: "";
  display: table;
  clear: both;
}
.mainservices .services-col {
  position: relative;
  padding: 15px 25px;
  width: 33.33%;
  float: left;
  color: #fff;
  min-height: 300px;
  flex: 1;
  -webkit-flex: 1; /* Safari */
  -ms-flex: 1; /* IE 10 */
}
.mainservices .services-col.darkblue {
  background: #417aa7;
}
.mainservices .services-col.lightblue {
  background: #40adfe;
}
.mainservices .services-col h3 {
  margin-top: 7px;
  font-size: 2.4vw;
  line-height: 4vw;
}
.mainservices .services-col p {
  font-size: 17px;
  margin-top: 10px;
  margin-bottom: 20px;
}
.mainservices .services-col a {
  display: inline-block;
  color: #417aa7;
  background: #fff;
  border: 1px solid #fff;
  padding: 7px 13px;
  font-weight: 600;
  transition: all 0.4s;
  border-radius: 5px;
}
.mainservices .services-col a:hover {
  transition: all 0.4s;
  background: transparent;
  color: #fff;
  text-decoration: none;
}
.mainservices .services-col .readmore {
  text-align: center;
}
.mainservices .sd{
  display: none;
}
.mainservices .sd .requestproposal {
  text-align: center;
  margin-bottom: 0;
  background: #014d89;
}
.mainservices .sd .requestproposal a {
  display: inline-block;
  color: #fff;
  padding: 5px 18px;
  font-size: 15px;
  letter-spacing: 1px;
  border-radius: 5px;
  border: 1px solid #014d89;
}
.mainservices .sd .rasp  {
  background: #ed1f24;
}
.mainservices .sd .rasp  a{
  border: 1px solid #ed1f24;
}
/* media query*/
@media (max-width: 768px){
  .mainservices .services-row {
    display: block;
  }
  .mainservices .services-col{
    width: 100%;
  }
  .mainservices .services-col .img-responsive{
    margin-left: auto;
    margin-right: auto;
  }
  .mainservices .services-col h3 {
    font-size: 30px;
    line-height: 35px;
    text-align: center;
  }
  .mainservices .sd{
    display: block;
  }
}
@media (max-width: 576px){
  .mainservices .sd .requestproposal a {
    font-size: 12px;
  }
}
/*media query ends*/
.digitalservices p.info {
  font-size: 22px;
  margin-top: 10px;
}
.digitalservices a {
  display: inline-block;
  margin-top: 30px;
  font-size: 20px;
  padding: 10px 20px;
  color: #024d89;
  border: 2px solid #024d89;
  border-radius: 5px;
  transition: all 0.5s;
}
.digitalservices a:hover {
  transition: all 0.5s;
  text-decoration: none;
  background: #024d89;
  color: #fff;
}
.digitalservices a i {
  margin-right: 10px;
}

.ourservices .servicebox {
  text-align: center;
  padding: 20px;
}
.ourservices .servicebox img {
  width: 23%;
}
.ourservices .servicebox p.title {
  margin-top: 20px;
  font-size: 21px;
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 2px;
}
.ourservices .servicebox p.info {
  font-size: 15px;
  color: #014d89;
}
.ourservices .servicebox a.packagelink {
  display: inline-block;
  color: #014d89;
  padding: 8px 20px;
  border: 1px solid #014d89;
  margin-top: 13px;
  border-radius: 5px;
  /*font-weight: 600;*/
  transition: all 0.6s;
}
.ourservices .servicebox a.packagelink:hover {
  text-decoration: none;
  background-color: #014d89;
  color: #fff;
  transition: all 0.6s;
}

.buttonsection a {
  display: inline-block;
  font-size: 22px;
  border: 1px solid #014d89;
  padding: 9px 40px;
  background: #014d89;
  letter-spacing: 1.8px;
  transition: all 0.4s;
  color: #fff;
}
.buttonsection a:hover {
  text-decoration: none;
  background: #fff;
  color: #014d89;
  border: 1px solid #014d89;
  transition: all 0.4s;
}
/*media query*/
@media (max-width: 990px){
  .buttonsection a {
    font-size: 1.8vw;
  }
}
@media (max-width: 768px){
  .buttonsection .col-md-6 p {
    text-align: center !important;
  }
}
@media (max-width: 576px){
  .buttonsection a {
    font-size: 12px;
    width: 100%;
  }
}
  
/*media query ends*/

.partners img {
  width: 15%;
  margin-right: 1%;
}
.partners img:last-child {
  margin-right: 0;
}

/*android development*/
.android-dev .banner {
  color: #fff;
  text-align: center;
}
.android-dev .banner h2 {
  font-size: 40px;
  font-weight: 600;
}
.android-dev .banner p {
  font-size: 20px;
}
.android-dev1 .servicebox {
  text-align: center;
  padding: 20px;
}
.android-dev1 .servicebox img {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.android-dev1 .servicebox p.title {
  margin-top: 20px;
  font-size: 21px;
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 20px;
  text-align: center;
}
.android-dev1 .servicebox p.info {
  font-size: 15px;
  text-align: justify;
}
.android-dev2 .servicebox img {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.android-dev2 .servicebox p.title {
  margin-top: 20px;
  font-size: 21px;
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 20px;
  text-align: center;
}
.android-dev2 .servicebox p.info {
  font-size: 15px;
  text-align: justify;
}
.android-dev2 h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 40px;
}
.contactus h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 0px;
}
.contactus p{
  text-align: center;
  margin-bottom: 40px;
}

/* App Promotion */
.app-prom .banner {
  color: #fff;
  text-align: center;
}
.app-prom .banner h2 {
  font-size: 40px;
  font-weight: 600;
}
.app-prom .banner p {
  font-size: 20px;
}
.app-prom1 .servicebox {
  text-align: center;
  padding: 20px;
}
.app-prom1 .servicebox img {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.app-prom1 .servicebox p.title {
  margin-top: 20px;
  font-size: 21px;
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 20px;
  text-align: center;
}
.app-prom1 .servicebox p.info {
  font-size: 15px;
  text-align: justify;
}
.app-prom2 h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 40px;
}
.app-prom2 .mob-app-serv h4{
  color: #014d89;
  text-align: center;
  font-size: 30px;
  margin-bottom: 20px;
}
.app-prom2 .mob-app-serv p{
  text-align: justify;
  margin-bottom: 20px;
}
.app-prom2 .mob-app-serv img{
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.app-prom2 .mob-app-serv .freequote {
  margin-top: 20px;
  margin-bottom: 30px;
  
}
.app-prom2 .mob-app-serv .freequote a {
  display: inline-block;
  font-size: 22px;
  border: 1px solid #fff;
  padding: 8px 22px;
  letter-spacing: 1.8px;
  transition: all 0.4s;
  background-color: #014d89;
  color: #fff;
  text-decoration: none;
}
.app-prom2 .mob-app-serv .freequote a:hover {
  background-color: #fff;
  color: #014d89;
  transition: all 0.4s;
}
.app-prom3 h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 40px;
}
.app-prom3 img{
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.app-prom3 p{
  margin-top: 20px;
  font-size: 21px;
  color: #014d89;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 20px;
  text-align: center;
}
.app-prom3 .col-md-2{
  width: 20%;
}

/*App UI/UX Design*/
 
.app-ui-design .banner {
  color: #fff;
  text-align: center;
}
.app-ui-design .banner h2 {
  font-size: 40px;
  font-weight: 600;
}
.app-ui-design .banner p {
  font-size: 20px;
}
.app-ui-design1 h2{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 40px;
}
.app-ui-design1 .col-md-2{
  width: 20%;
}
.app-ui-design1 img{
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-top: 20px;
}
.app-ui-design1 .col-md-2 p{
  color: #014d89;
  font-size: 20px;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 40px;
} 
.app-ui-design1 .freequote {
  margin-top: 20px;
  margin-bottom: 30px;
  text-align: center;
}
.app-ui-design1 .freequote a {
  display: inline-block;
  font-size: 22px;
  border: 1px solid #fff;
  padding: 8px 22px;
  letter-spacing: 1.8px;
  transition: all 0.4s;
  background-color: #014d89;
  color: #fff;
  text-decoration: none;
}
.app-ui-design1 .freequote a:hover {
  background-color: #fff;
  color: #014d89;
  transition: all 0.4s;
}
.app-ui-design2 .nav-tabs li a{
  color: #0090fd;
  border: 1px solid #0090fd;
  border-radius: 0;
  text-align:center ;
}
.app-ui-design2 .nav-tabs li a:hover{
 background-color: #0090fd;
 color: #fff;
}
.app-ui-design2 .nav-tabs li a span{
  font-weight: 600;
}
.app-ui-design2 .nav-tabs .nav-item{
  width: 25%;
}
.app-ui-design2 .nav-tabs .nav-link{
  margin:0;
}
.app-ui-design2 .nav-tabs li.active{
  background-color: #0090fd;
  color: #fff;
}
.app-ui-design2 .nav-tabs li.active a:focus{
  background-color: #0090fd;
  color: #fff;
}
.app-ui-design2 .tab-content .tab-pane {
  text-align: center;
  margin-top: 40px;
}


.app-ui-design3 img{
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 50%;
}
.app-ui-design3 p{
  text-align: center;
  margin-top: 20px;
  color: #014d89;
  margin-bottom: 30px;
}
.app-ui-design3 h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
  margin-bottom: 60px;
}
.app-ui-design4 h3{
  color: #014d89;
  font-size: 40px;
  text-align: center;
}
.app-ui-design4 h4{
  color: #014d89;
  font-size: 20px;
  text-align: center;
  margin-bottom: 40px;
}
.app-ui-design4 h2{
  color: #014d89;
  font-size: 25px;
}
.app-ui-design4 p{
  font-size: 16px;
}
.app-ui-design4 ul{
  margin-left: 20px;
  margin-right: 20px;
}
.app-ui-design4 ul li::marker{
  color: #014d89;;
}
/* Archives Page */
.archives .archivehead {
  margin-top: 10px;
  font-size: 26px;
  font-weight: bold;
}
.archives .archivedate {
  color: #747474;
}
.archives .archivetext {
  font-size: 20px;
}
.archives .archivelink a {
  display: inline-block;
  padding: 8px 30px;
  border: 2px solid #014d89;
  border-radius: 5px;
  color: #014d89;
  font-size: 17px;
  text-decoration: none;
  margin-top: 15px;
  transition: all 0.4s;
}
.archives .archivelink a:hover {
  background: #014d89;
  color: #fff;
  transition: all 0.4s;
  text-decoration: none;
}


/* Blog Inside Page */
.bloginside .bloginfo {
  color: #747474;
  font-size: 15px;
}
.bloginside .bloginfo .date {
  margin-right: 30px;
}
.bloginside .archivelink {
  text-align: right;
}
.bloginside .archivelink a {
  display: inline-block;
  padding: 8px 30px;
  border: 2px solid #014d89;
  border-radius: 5px;
  color: #014d89;
  font-size: 17px;
  text-decoration: none;
  margin-top: 20px;
  transition: all 0.4s;
}
.bloginside .archivelink a:hover {
  background: #014d89;
  color: #fff;
  transition: all 0.4s;
  text-decoration: none;
}
.bloginside .tags a {
  display: inline-block;
  color: #fff;
  border: 1px solid #014d89;
  padding: 3px 15px;
  border-radius: 5px;
  margin-right: 13px;
  background: #014d89;
  transition: all 0.4s;
  margin-top: 10px;
}
.bloginside .tags a:hover {
  color: #014d89;
  background: transparent;
  transition: all 0.4s;
  text-decoration: none;
}
.bloginside .relatedpost h4 {
  line-height: 23px;
}
.bloginside .relatedpost .date {
  color: #747474;
  font-size: 15px;
}
.bloginside .blogcommon {
  text-align: center;
}
.bloginside .blogcommon img {
  width: 20%;
}
.bloginside .blogcommon h3 {
  font-size: 28px;
  font-weight: 800;
}
.bloginside .blogcommon .archivelink {
  text-align: center;
}
.bloginside .blogcommon .archivelink a {
  font-size: 19px;
  font-weight: 600;
}

/* Subscribe Form */
.subscribeform {
  margin-top: 40px;
  margin-bottom: 40px;
}
.subscribeform .form-control {
  border-radius: 0;
  font-size: 16px;
  height: 40px;
  
}
.subscribeform .subscribebtn {
  display: inline-block;
  color: #014d89;
  border: 2px solid #014d89;
  padding: 4px 62px;
  font-size: 20px;
  letter-spacing: 1px;
  transition: all 0.4s;
  width: 100%;
  text-align: center;
}
.subscribeform .subscribebtn:hover {
  background: #014d89;
  color: #fff;
  transition: all 0.4s;
  text-decoration: none;
}

/* Website SEO Page */
.websiteseo {
  text-align: center;
  color: #fff;
}
.websiteseo p {
  font-size: 21px;
}
.websiteseoform .form-group {
  margin-bottom: 20px;
}
.websiteseoform .form-group .form-control{
  border: 1.5px solid #000;
}
.websiteseoform input, .websiteseoform select {
  height: 40px;
  font-size: 16px;
  border-radius: 0;
  
}
.websiteseoform textarea {
  border-radius: 0;
  border: 1.5px solid #000;
  resize: none;
}
.websiteseoform .help-block {
  font-size: 12px;
}
.websiteseoform .submitbtn {
  display: inline-block;
  color: #014d89;
  margin-top: 25px;
  border: 2px solid #014d89;
  padding: 10px 32px;
  font-size: 20px;
  transition: all 0.4s;
}
.websiteseoform .submitbtn:hover {
  transition: all 0.4s;
  text-decoration: none;
  background: #014d89;
  color: #fff;
}

/* About Us Page */
.aboutus {
  padding-top: 10px;
  padding-bottom: 30px;
}
.aboutus .banner {
  color: #fff;
  text-align: center;
}
.aboutus .banner h2 {
  font-size: 40px;
  font-weight: 600;
}
.aboutus .banner p {
  font-size: 20px;
}
.aboutus1 .aboutus-3 {
  text-align: center;
}
.aboutus1 .aboutus-3 img {
  width: 45%;
  margin-bottom: 20px;
}
.aboutus1 .aboutus-3 p {
  font-size: 23px;
  font-weight: 600;
  color: #014d89;
}
.ourvision {
  text-align: center;
  color: #fff;
}
.ourvision h2 {
  margin: 0;
  margin-bottom: 20px;
  font-size: 33px;
  font-weight: 600;
}
.ourvision p {
  margin: 0;
  font-size: 21px;
}

/* Pricing Page */
.faqs .title {
  font-size: 22px;
  color: #014d89;
  font-weight: 600;
}
.faqs .info {
  margin-bottom: 25px;
}

/* Contact Us Page */
.contactus .contactinfo p{
  margin-bottom: 40px;
}
.contactus .contactinfo p span {
  font-size: 12px;
  color: #737373;
}
.contactus .contactinfo a {
  color: #014d89;
  /*font-size: 20px;*/
  font-weight: 600;
}
.contactus .contactinfo a:hover {
  text-decoration: none;
}
.contactus .contactinfo .address {
  color: #014d89;
  font-weight: 600;
  font-size: 16px;
}

/* Service Pages */
.servicebanner {
  color: #fff;
  text-align: center;
}
.servicebanner .text {
  padding-top: 50px;
}
.serviceinfo .serviceinfo-big {
  font-size: 22px;
  text-align: justify;
  color: #014d89;
}
.serviceinfo .serviceinfo-big1 {
  font-size: 26px;
}
.serviceinfo .serviceinfo-small {
  font-size: 18px;
  text-align: justify;
  color: #014d89;
}
.serviceinfo .service-box {
  text-align: center;
}
.serviceinfo .service-box img {
  width: 25%;
}
.serviceinfo .col-md-4 .service-box img, .serviceinfo-social .col-md-3 .service-box img {
  width: 35%;
}
.serviceinfo .service-box h3 {
  font-size: 26px;
  color: #014d89;
  font-weight: 600;
}
.serviceinfo .service-box p {
  font-size: 20px;
}
.pricing-section .darkblue {
  background: #014d89;
}
.pricing-section .lightblue {
  background: #0090fd;
}
.pricing-section .minheight-auto {
  min-height: auto;
}
.pricing-section .services-col {
  text-align: center;
  padding: 0;
}
.pricing-section .services-col .services-body {
  padding: 15px 25px;
}
.pricing-section .services-col .services-body h3 {
  margin: 0;
}
.pricing-section .services-col .services-body .wslist li{
  color: #000 !important;
  text-align: left;
  
}
.pricing-section .service-plan-body img {
  width: 30%;
}
.pricing-section .service-plan-body h2 {
  font-weight: 600;
}

.pricing-section .service-plan-body p.pricing-title {
  font-size: 21px;
}
.pricing-section .darkblue.service-plan-body .buynowlink a {
  background: #40adfe;
  border-color: #40adfe;
  color: #fff;
  padding: 10px 70px;
  font-size: 26px;
  letter-spacing: 1px;
  border-radius: 0;
  transition: all 0.4s;
}
.pricing-section .darkblue.service-plan-body .buynowlink a:hover {
  border: 1px solid #fff;
  background: transparent;
  transition: all 0.4s;
}
.pricing-section .lightblue.service-plan-body .buynowlink a {
  background: #417aa7;
  border-color: #417aa7;
  color: #fff;
  padding: 10px 70px;
  font-size: 26px;
  letter-spacing: 1px;
  border-radius: 0;
  transition: all 0.4s;
}
.pricing-section .lightblue.service-plan-body .buynowlink a:hover {
  border: 1px solid #fff;
  background: transparent;
  transition: all 0.4s;
}
.belowservice-background {
  background: #bfd2e1;
}
.belowservice-background p {
  color: #000;
  font-size: 20px !important;
  line-height: 30px;
}

/* Case Studies CSS */
#buttons button {
  background: transparent;
  border: 1px solid #014d89;
  margin-right: 10px;
  /*border-radius: 5px;*/
  padding: 5px 20px;
  margin-bottom: 10px;
}
#buttons button.active {
  background: #014d89;
  color: #fff;
}
#gallery .gallery-sec {
  margin-top: 20px;
}
#gallery .inside {
  background: #014d89;
  padding: 20px;
  color: #fff;
  text-align: center;
  font-size: 16px;
}
#gallery .inside img {
  margin-bottom: 20px;
}
#gallery .inside .project-title {
  font-size: 20px;
}

/* Downloads View Page CSs */
.downloads-view .item {
  text-align: center;
}
.downloads-view .item img {
  width: 30%;
  margin: 0 auto;
  margin-top: 40px;
}
.downloads-view .downloadlink {
  display: inline-block;
  padding: 8px 30px;
  border: 2px solid #014d89;
  border-radius: 5px;
  color: #014d89;
  font-size: 17px;
  text-decoration: none;
  margin-top: 30px;
  transition: all 0.4s;
}
.downloads-view .downloadlink:hover {
  background: #014d89;
  color: #fff;
  transition: all 0.4s;
  text-decoration: none;
}
.downloads-view .allprojects {
  font-size: 20px;
  font-weight: 800;
}

/* Ebook page css */
.book-sec {
  text-align: center;
  font-size: 18px;
}
.book-sec img {
  width: 40%;
}
.book-sec .book-title {
  font-size: 22px;
  margin-top: 20px;
}
.book-sec .book-download {
  display: inline-block;
  color: #014d89;
  padding: 8px 20px;
  border: 1px solid #014d89;
  margin-top: 13px;
  border-radius: 5px;
  /* font-weight: 600; */
  transition: all 0.6s;
}
.book-sec .book-download:hover {
  text-decoration: none;
  background-color: #014d89;
  color: #fff;
  transition: all 0.6s;
}

/* Project Views */
.projects-header {
  padding-top: 20px;
  padding-bottom: 20px;
}
.projects-header .project-title {
  margin: 0;
  font-size: 30px;
  font-weight: 800;
}
.projects-header .project-details {
  margin: 0;
  font-size: 20px;
  text-align: left;
  padding-top: 7px;
}
.projects-header .project-link {
  display: inline-block;
  background: #014d89;
  color: #fff;
  padding: 10px 21px;
  border-radius: 5px;
}
.projects-header .project-link img {
  width: 35px;
  margin-right: 10px;
}
.projects-header .project-link:hover {
  text-decoration: none;
}
.project-detail-desc .project-image .project-bg {
  background: #40adfe;
}
.project-detail-desc .project-image .project-bg p {
  text-align: center;
  font-weight: 800;
  padding: 10px;
}
.openwebsite {
  display: inline-block;
  margin-top: 12px;
  background: #fff;
  font-size: 20px;
  font-weight: 600;
  padding: 10px 20px;
  border: 2px solid #014d89;
}
.openwebsite:hover {
  text-decoration: none;
}
.openwebsite img {
  width: 20px;
  margin-right: 10px;
  vertical-align: text-bottom;
}


/* Footer CSS */
.footer {
  background: var(--background-patch);
  color: #fff;
  padding-top: 30px;
  /*padding-bottom: 30px;*/
}
.footer a {
  color: #fff;
  text-decoration: none;
  transition: all 0.4s;
}
.footer .contact p {
  font-size: 20px;
}
.footer .contact p i {
  margin-right: 5px;
}
.footer .footlinks {
  margin-top: 20px;
}
.footer .footlinks p {
  font-size: 18px;
  margin-bottom: 25px;
  font-weight: 600;
  letter-spacing: 1.1px;
}
.footer .footlinks ul {
  display: block;
  list-style: none;
  padding: 0;
}
.footer .footlinks ul li {
  margin-bottom: 10px;
}
.footer .footlinks ul li a {
  letter-spacing: 1.3px;
  font-size: 15px;
}
.footer .social-links, .footer .freequote {
  margin-top: 20px;
  margin-bottom: 30px;
}
.footer .social-links a {
  font-size: 30px;
  margin-right: 10px;
}
.footer .freequote a {
  display: inline-block;
  font-size: 22px;
  border: 1px solid #fff;
  padding: 8px 22px;
  letter-spacing: 1.8px;
  transition: all 0.4s;
}
.footer .freequote a:hover {
  background-color: #fff;
  color: var(--background-patch);
  transition: all 0.4s;
}
.copyrightsection {
  border-top: 1px solid #fff;
  color: #fff;
}
.copyrightsection .copyright p {
  padding-top: 10px;
  font-size: 14px;
}
.footer .sd{
  display: none;
}
.footer .sd ul{
  padding: 0;
}
.footer .sd ul li{
  list-style: none;
}
.footer .sd ul li p{
  text-align: center;
  padding-top: 5px;
  border-top: 1.5px solid #fff;
}
.footer .sd .last{
  border-bottom: 1.5px solid #fff;
  padding-bottom: 10px;
}
.footer .sd .collapse li{
  display:table;
  margin:0px auto 0px auto;
}
.footer .sd .icon p a{
  display: inline-block;
  margin-right: 10px;
}
.footer .sd .icon p{
  text-align: center;
}
.footer .sd .fbs a{
  display: inline-block;
  font-size: 22px;
  border: 1px solid #014d89;
  padding: 9px 40px;
  background: #014d89;
  letter-spacing: 1.8px;
  transition: all 0.4s;
  color: #fff;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px;
}
/* media query */
@media  (max-width: 576px) {
  .footer .ld{
    display: none;
  }
  .footer .sd{
    display: block;
  }
  .footer .contact p {
    text-align: center;
  }
  .footer .sd .img-responsive{
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
  }
}
/* Footer CSS */


/* Featured Carousel */

.featured-carousel {
  margin-top: 100px;
  position: relative;
}
.featured-carousel ul.app-feature-gallery {
  list-style: none;
  display: block;
  /*float: left;*/
  width: 80%;
  margin: 0 auto;
  position: relative;
  left: 5%;
}
.featured-carousel ul.app-feature-gallery li {
  left: 0;
	top: 0;
	/*position: absolute;*/
	width: 100%;
	height: 100%;
	z-index: 0;
	cursor: pointer;
	-webkit-transform: scale(.85);
	-moz-transform: scale(.85);
	-ms-transform: scale(.85);
	-o-transform: scale(.85);
	transform: scale(.85);
	/*-webkit-opacity: 0;*/
	/*-moz-opacity: 0;*/
	/*opacity: 0;*/
	/*-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, .1);*/
	/*-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, .1);*/
	/*box-shadow: 0 3px 6px rgba(0, 0, 0, .1);*/
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-ms-transition: all .3s linear;
	-o-transition: all .3s linear;
	transition: all .3s linear;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px
}
.featured-carousel ul.app-feature-gallery li div {
  width: 65%;
  margin: 0 auto;
  background: #014d89;
  color: #fff;
  text-align: center;
  padding: 30px;
  padding-bottom: 20px;
}
.featured-carousel ul.app-feature-gallery li div img {
  width: 100%;
}
.featured-carousel ul.app-feature-gallery li div p {
  margin: 0;
  font-size: 30px;
  margin-top: 10px;
}
.featured-carousel ul.app-feature-gallery li:nth-child(2) {
  position: absolute;
  top: -8%;
  left: -1%;
  z-index: -1;
  opacity: 0.8;
}
.featured-carousel ul.app-feature-gallery li:nth-child(3) {
  position: absolute;
  top: -16%;
  left: -5%;
  z-index: -2;
  opacity: 0.6;
}
.featured-carousel ul.app-feature-gallery li:nth-child(4) {
  position: absolute;
  top: -25%;
  left: -9%;
  z-index: -3;
  opacity: 0.4;
}
.featured-carousel .featured-nav-buttons {
  position: absolute;
  top: 20%;
  width: 100%;
}
.featured-carousel .featured-nav-buttons a {
  padding: 10px 15px;
  text-align: center;
  margin: 0;
  background: #dbdbdb;
  border: 1px solid #dbdbdb;
  color: #fff;
  border-radius: 0px;
}
.featured-carousel .featured-nav-buttons a i {
  margin: 0;
}
.featured-carousel .featured-nav-buttons a.back {
  position: absolute;
  left: 5%;
}
.featured-carousel .featured-nav-buttons a.next {
  position: absolute;
  right: 5%;
}

/* Featured Carousel */