/* --------------------------------------------------------------------------------------------------
Styling for Navigation Bar :
---------------------------------------------------------------------------------------------------- */
#header .logo .company-name{
    font-size:1.50vw;
    font-weight:800;
}

#header .logo .logo-image{
    height:3vw;
}

.navigation-link{
    font-weight: 700;
}

@media (min-width:991px) {
    .header-contents {
      height: 100%;
    }

    .logo {
      height: 100%;
      display: flex;
      align-items: center;
    }

    .nav-menu {
      height: 100%;
    }

    .nav-menu ul {
      height: 100%;
    }

    .nav-menu ul .nav-menu-item {
      height: 100%;
    }

    .nav-menu ul .nav-menu-item .navigation-link,
    .nav-menu ul .nav-menu-item .wide-navigation {
      height: 100%;
      display: flex;
      align-items: center;      
    }
  }

/*  
.nav-menu-item .navigation-link:after,.nav-menu-item .navigation-link:before {
    display: inline-block;
    font-weight: 400;
    opacity: 0;
    color: #345374;
}

.nav-menu-item .navigation-link:before {
    content: "\2997";   
    margin-right:-10px;
}

.nav-menu-item:hover .navigation-link:before {
    opacity: 1;
    transform: translate(-10px);
    transition: transform 0.3s ease 0s,opacity 0.2s ease 0s,-kit-transform 0.3s ease 0s;
}

.nav-menu-item .navigation-link:after {
    content: "\2998";
    margin-left:-10px;
}

.nav-menu-item:hover .navigation-link:after {
    opacity: 1;
    transform: translate(10px);
    transition: transform 0.3s ease 0s,opacity 0.2s ease 0s,-webkit-transform 0.3s ease 0s;
} */

.nav-submenu-indicator{
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

/* #header .nav-menu .interactive{
    color:white !important;  
    background-color: #345374;
    border-radius:12px;   
    margin: 4px;
}
.nav-menu-item .interactive.navigation-link:after,.nav-menu-item .interactive.navigation-link:before {
    color:white;
} */



.drop-down-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 7rem;
    font-size: 1rem;
    color: #000;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    box-shadow:  0px 8px 16px 0px rgba(0,0,0,0.2);
    border-radius: .25rem;
}

.drop-down-toggler:hover .drop-down-menu{
    display: block;
}

.drop-down-toggler .drop-down-title{
    cursor: default;
}
.drop-down-menu:before{
  background-color: #fff;
  content: "";
  width: 22px;
  height: 22px;
  left: 47px;
  top: -11.5px;
  position: absolute;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  border-left:1px solid #000;
  border-top:1px solid #000;
}

.drop-down-item{
    display:block;
    width:100%;
    clear:both;
    font-weight:500;
    font-size: 17px !important;
    text-align:inherit;
    white-space:nowrap;
    background-color:transparent;
    border:0;
    border-bottom:0.75px solid black ;
    border-radius: 3px;
    text-decoration: none;
    position: relative;
    padding: 16px;
    /* border: 1px solid #fcfcfc; */
    z-index: 20;
    transition: all 0.35s cubic-bezier(1, 0, 0, 1);
}

.drop-down-item::before,
.drop-down-item::after {
  content: "";
  position: absolute;
  z-index: -1;
  transition: all 0.35s cubic-bezier(1, 0, 0, 1);
}
.btn-l-r::after {
    height: 100%;
    width: 0;
    top: 0;
  }
  
  .btn-l-r:hover::after {
    width: 100%;
  }
  
  .btn-l-r::after {
    left: 0;
  }
  
.drop-down-item:focus,.drop-down-item:hover{
    color:#fff !important;
}

.drop-down-item.item-color{
    border-color: #345374;
    color: #345374;
}

.drop-down-item.item-color::before, .drop-down-item.item-color::after {
    background: #345374;
  }


.drop-down-item.item-color.active,.drop-down-item.item-color:active{
    color:#fff !important;
    text-decoration:none;
    background-color:#345374;
}

.drop-down-item.item-color.disabled,.drop-down-item.item-color:disabled{
    color:#6c757d;
    pointer-events:none;
    background-color:transparent;
}

.drop-down-menu .services-dropdown{
    position: fixed;
    left: 0px;
    width: 100vw;
    justify-content: center;
    display: flex;
}

.drop-down-menu .services-dropdown .row {
    background-color: #fff;
    padding-bottom: 10px;    
    border: 1px solid rgba(0,0,0,.15);
    border-top: transparent;
    box-shadow:  0px 8px 16px 0px rgba(0,0,0,0.2);
}

.drop-down-menu .services-dropdown .drop-down-item.active{
    background-color: transparent;
}

.drop-down-menu .services-dropdown .row .dropdown-section .drop-down-item{
    border: none;
    padding: 2px 2px 0px 15px;
    transition: all 0s;
    font-size: 90% !important;
    color: #444 !important;
}

.drop-down-menu .services-dropdown .row .dropdown-section .drop-down-item:focus,
.drop-down-menu .services-dropdown .row .dropdown-section .drop-down-item:hover{
    color: #345374 !important;
    font-weight: 700 !important ;
}

.services-dropdown .dropdown-section-heading{
    padding: 5px 10px 5px 15px;
    font-size: 105%;
    font-weight: 900;
}

/* ----  Till 1200px --- */
@media (max-width: 1200px)  {
    .nav-menu a{
        padding:8px 12px;
    }
}

/* ----  Till 992px --- */
@media (max-width: 991px)  {
    #header .logo .company-name{
        font-size:4vh;
    }
    #header .logo .logo-image{
        height: 6vh;
    }
    .drop-down-menu{
        position:relative;
        float: unset;
        background-color: transparent;
    }
    .drop-down-menu::before{
        display: none;
    }
    .drop-down-menu.company-dropdown{
        max-width:25%;
        position: relative;
        left: 30px;
        background-color: #fff;
    }
    .drop-down-menu .services-dropdown{
        position: relative;
        /* left:30px; */
        max-width: 100%;
        background-color: transparent;
    }
    

}

@media (max-width:768px) {
    .drop-down-menu{
        max-width: 70%;
        position: relative;
        left: 30px;
    }
}

/*  ------ Till 400 ------ */
@media (max-width: 400px)  {
    #header .logo .company-name{
        font-size:5vw;
    }
    #header .logo .logo-image{
        height: 7.5vw;
    }
    
}



/* -------------------------------------------------------------------------------------------
Styling for Hero Banner Home Page
---------------------------------------------------------------------------------------------*/
.mySlides {
    height: 100%;
    display: block;
    margin: auto 0px;
}

img {
    vertical-align: middle;
}

/* Slideshow container */
.slideshow-container {
  width: 100%;
  position: relative;
  margin: auto;
  background-color: #345374;
  background-image: linear-gradient(#45658480,rgba(69, 101, 132, 0.5));
  height: 100%;
}



/* Default Slide */
.matrix-default{
    background-color: #345374;
    background-image: linear-gradient(to right,#ffffff00, rgba(211, 222, 230,0),#345374aa),url(../img/home-hero-banner-102.svg);
     height:100%;    
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     position: relative;
}
.matrix-default .slide-headings{
    position: relative;
    animation:fading-in-down 1.4s .3s both;
    text-align: right;
}
.matrix-default .slide-headings h1{
    color: #fff;
    text-shadow: 2px 2px 0px #345374;
}
.matrix-default .slide-buttons{
    position: relative;
    animation: fading-in-bottom-left 1.2s .8s both; 
    margin: 20px 0px;
}
.matrix-default .slide-buttons .slide-button{
    background-color: #C8DBFE;
    color: #345374;
    padding: 10px 30px;
    border-radius: 50px;
}
.matrix-default .slide-buttons .slide-button:hover{
    background-color: #345374;
    color: #8bc4ea;
}
.matrix-default .slideshow-images{
    position: relative;
    animation: fading-in-up 1s 0.3s both,up-down 2s ease-in-out infinite alternate-reverse both;
}




/*  Development Slide */
.development-slide{
    background-color: #345374;
    /* background-image: linear-gradient(to bottom,white, rgb(211, 222, 230),rgb(247, 247, 243)); */
    background-image: url(../img/home-banner-2.svg);
      height: 100%;    
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      position: relative; 
}
.development-slide .slide-headings{
    position: relative;
    animation: fading-in-top-right 1s 0.3s both;
    text-align: left;
}
.development-slide .slide-headings h1{
    color: #fff;
    text-shadow: 2px 2px 0px #345374;
}
.development-slide .slide-headings h2{
    color: #ffc221 !important;
    text-overflow: 3px 3px 0px #000000;
}
.development-slide .slide-buttons .slide-button{
    background-color: #C8DBFE;
    color: #345374;
    padding: 10px 30px;
    border-radius: 50px;
}
.development-slide .slide-buttons .slide-button:hover{
    background-color: #345374;
    color: #8bc4ea;
}
.development-slide .slide-buttons{
    position: relative;
    animation: fading-in-left 1.2s 0.6s both;
    margin:20px  0px;
}
.development-slide .slideshow-images{
    position: relative;
    animation: fading-in-down 1s 0.3s both,up-down 2s ease-in-out infinite alternate-reverse both;
}



/* Digital Marketing Slide */
.digm-slide{
    background-color:#345374;
    /* background-image: linear-gradient(to bottom,white,rgb(211, 222, 230),#F7F7F3); */
     /* background-image: linear-gradient(rgba(211, 222, 230, 0.5),rgba(69, 101, 132, 0.5)); */
    background-image: linear-gradient(to right,#34537488,#45648488,rgba(255,255,255, 0),rgba(255,255,255, 0),rgba(255,255,255, 0),rgba(255,255,255, 0),rgba(255,255,255, 0),rgba(255,255,255, 0)),url("../img/home-banner-4.gif");     
     height: 100%;   
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     position: relative;
}
.digm-slide .slide-headings{
    position: relative;
    animation: fading-in-left 1s 0.2s both;
}
.digm-slide .slide-headings h2{
    color: #ffc221 !important;
}
.digm-slide .slide-headings h1{
    color: #000;
}
.digm-slide .slide-buttons{
    position: relative;
    animation: fading-in-right 1s 0.8s both;
    margin:20px  0px;
}
.digm-slide .slide-buttons .slide-button{
    font-family: "Raleway", sans-serif;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 30px;
    border-radius: 50px;
    transition: 0.5s;
    color: #345374;
    border: 2px solid #3498db;
    background-color: #fff;
}
.digm-slide .slideshow-images{
    position: relative;
    animation: fading-in-bottom-right 2s 0.3s both,up-down 2s ease-in-out infinite alternate-reverse both;
}



/* IT Support Slide */
.it-slide{
    background-color:#345374;
    /* background-image: linear-gradient(to bottom,#F8FCFF,#F8FCFF,#F7F7F3); */
     background-image: url("../img/home-banner-3.jpeg");
    height: 100%;   
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     position: relative;
}
.it-slide .slide-headings{
    position: relative;
    animation: fading-in-down 1.5s 0.5s both;
    color: #fff;
    /* text-shadow: 2px 2px 0px #345374; */
    text-align: right;
}

.it-slide .slide-buttons{
    position: relative;
    animation: fading-in-up 1.5s 0.75s both;
    margin:20px 0px;
}
.it-slide .slideshow-images{
    position: relative;
    animation: fading-in-bottom-left 2s 0.3s both,up-down 2s ease-in-out infinite alternate-reverse both;
}

.slideshow-text{
    background-color: #4366ff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%235782ff' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23639dff' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%236bb9ff' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%236fd5ff' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%236ef1ff' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%2363cfe2' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%2358aec5' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%234c8fa9' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%2340708e' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23345374' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
    padding:40px 0px;
}
.slideshow-text h1{
    text-align: center;
    font-size:24px !important; 
    color: #000;
    margin-bottom: 8px !important; 
}
.slideshow-text h2{
    text-align: center;
    color: #4b185f;
    margin-bottom: 8px !important; 
    font-size: 20px !important;
}
.slide-buttons{
    position: relative;
    animation: fading-in-bottom-left 1.2s .2s both; 
    margin: auto;
}
.slide-buttons .slide-button{
    background-color: #C8DBFE;
    color: #261431;
    font-family: "Raleway", sans-serif;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 30px;
    border-radius: 50px;
    transition: 0.2s;
}
.slide-buttons .slide-button:hover{
    background-color: #261431;
    color: #8bc4ea;
}

@media (max-width:991px) {
    .matrix-default{
        background-position: left;
        height: 65vh;
    }
    .development-slide{
        background-position: right;
        height: 60vh;
    }
    .it-slide{
        background-position: left;
        height: 65vh;
    }
    .digm-slide{
        background-position: right;
        background-image: linear-gradient(to right,#0000,#0000),url("../img/home-banner-4.gif");
        height: 60vh;
    }
}

@media (max-width:420px){
    .digm-slide{
        background-image: url("../img/home-banner-4.svg");
        background-position: center center;
    }
}

@media (max-width:991px) {
    .slide-buttons .slide-button{
        font-weight: 700;
        font-size: 14px;
        padding: 8px 25px;
    }
}

@media (max-width:768px) {
    .slide-buttons .slide-button{
        font-weight: 600;
        font-size: 12px;
        padding: 6px 20px;
    }
}




/* Fading animation */
.faded {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
  }
  

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 7px 14px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 16px;
  transition: 0.6s ease;
  border-radius: 50%;
  user-select: none;
  background-color: #fff;
}

.prev{
    left: 10px;
}

/* Position the "next button" to the right */
.next {
  right: 10px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  border:2px solid #345374;
  background-color:#fff;
}

.slide-navigation{
    text-align:center;
    height:0px;
    position: relative;
    top: -50px;
}

/* The dots/bullets/indicators */
.slide-navigator {
  cursor: pointer;
  height: 11px;
  width: 11px;
  margin: 0 2px;
  background-color:#d3dee7;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.slide-navigator:hover {
  background-color:#456484;
}


.slide-navigator:hover{
  border:1px solid #d3dee7;
}

.active.slide-navigator{
    border: 2px solid #fff;
    background-color: #456484;
}

.slideshow-images{
    width: 100%;
    height: 70vh;
}




/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
    .prev, .next {font-size: 11px}
  }
  
@media (max-width:991px) {
      .slide-navigation{
          display: none;
      }

      /* .slide-headings{
          text-align: center;
          width: 100%;
          background-image: linear-gradient(to right,#fff,#34537455,#345374AA,#345374,#345374AA,#34537455,#fff);
      }
      .slide-headings h1,.slide-headings h2{
        color:#fff !important;
      } */
}


@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}


@-webkit-keyframes fading-in-down {
    from {top: -50px; opacity:0;}
    to {top: 0px; opacity:1;}
  }

  
@keyframes fading-in-down {
    from {top: -50px; opacity:0;}
    to {top: 0px; opacity:1;}
  }



  @-webkit-keyframes fading-in-up {
    from {bottom: -50px; opacity:0;}
    to {bottom: 0px; opacity:1;}
  }

  
@keyframes fading-in-up {
    from {bottom: -50px; opacity:0;}
    to {bottom: 0px; opacity:1;}
  }


  @-webkit-keyframes fading-in-right {
    from {right: -50px; opacity:0;}
    to {right: 0px; opacity:1;}
  }

  
@keyframes fading-in-right {
    from {right: -50px; opacity:0;}
    to {right: 0px; opacity:1;}
  }


  @-webkit-keyframes fading-in-left {
    from {left: -50px; opacity:0;}
    to {left: 0px; opacity:1;}
  }

  
@keyframes fading-in-left {
    from {left: -50px; opacity:0;}
    to {left: 0px; opacity:1;}
  }

  @-webkit-keyframes fading-in-top-left {
    from {top:-50px;left: -50px; opacity:0;}
    to {top:0px; left: 0px; opacity:1;}
  }

  
@keyframes fading-in-top-left {
    from {top:-50px; left: -50px; opacity:0;}
    to {top:0px; left: 0px; opacity:1;}
  }

  @-webkit-keyframes fading-in-bottom-left {
    from {bottom:-50px;left: -50px; opacity:0;}
    to {bottom:0px;left: 0px; opacity:1;}
  }

  
@keyframes fading-in-bottom-left {
    from {bottom:-50px;left: -50px; opacity:0;}
    to {bottom:0px;left: 0px; opacity:1;}
  }

  @-webkit-keyframes fading-in-top-right {
    from {top:-50px;right: -50px; opacity:0;}
    to {top:0px;right: 0px; opacity:1;}
  }

  
@keyframes fading-in-top-right {
    from {top:-50px;right: -50px; opacity:0;}
    to {top:0px;right: 0px; opacity:1;}
  }

  @-webkit-keyframes fading-in-bottom-right {
    from {bottom:-50px;right: -50px; opacity:0;}
    to {bottom:0px;right: 0px; opacity:1;}
  }

  
@keyframes fading-in-bottom-right {
    from {bottom:-50px;right: -50px; opacity:0;}
    to {bottom:0px;right: 0px; opacity:1;}
  }


  @-webkit-keyframes up-down {
    0% {
      transform: translateY(10px);
    }
    100% {
      transform: translateY(-10px);
    }
  }
  
  @keyframes up-down {
    0% {
      transform: translateY(10px);
    }
    100% {
      transform: translateY(-10px);
    }
  }
  


/* --------------------------------------------------------------------------------------------
Home page About Section : Who we are
----------------------------------------------------------------------------------------------*/
.about-section-bg{
background-color: #fff;
/* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1500'%3E%3Cdefs%3E%3CradialGradient id='a' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23ffffff'/%3E%3Cstop offset='1' stop-color='%23d3dee7'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='750' x2='1550' y2='750'%3E%3Cstop offset='0' stop-color='%23e9eff3'/%3E%3Cstop offset='1' stop-color='%23d3dee7'/%3E%3C/linearGradient%3E%3Cpath id='s' fill='url(%23b)' d='M1549.2 51.6c-5.4 99.1-20.2 197.6-44.2 293.6c-24.1 96-57.4 189.4-99.3 278.6c-41.9 89.2-92.4 174.1-150.3 253.3c-58 79.2-123.4 152.6-195.1 219c-71.7 66.4-149.6 125.8-232.2 177.2c-82.7 51.4-170.1 94.7-260.7 129.1c-90.6 34.4-184.4 60-279.5 76.3C192.6 1495 96.1 1502 0 1500c96.1-2.1 191.8-13.3 285.4-33.6c93.6-20.2 185-49.5 272.5-87.2c87.6-37.7 171.3-83.8 249.6-137.3c78.4-53.5 151.5-114.5 217.9-181.7c66.5-67.2 126.4-140.7 178.6-218.9c52.3-78.3 96.9-161.4 133-247.9c36.1-86.5 63.8-176.2 82.6-267.6c18.8-91.4 28.6-184.4 29.6-277.4c0.3-27.6 23.2-48.7 50.8-48.4s49.5 21.8 49.2 49.5c0 0.7 0 1.3-0.1 2L1549.2 51.6z'/%3E%3Cg id='g'%3E%3Cuse href='%23s' transform='scale(0.12) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.2) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.25) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(0.3) rotate(-20)'/%3E%3Cuse href='%23s' transform='scale(0.4) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(0.5) rotate(20)'/%3E%3Cuse href='%23s' transform='scale(0.6) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.7) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.835) rotate(-40)'/%3E%3Cuse href='%23s' transform='scale(0.9) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(1.05) rotate(25)'/%3E%3Cuse href='%23s' transform='scale(1.2) rotate(8)'/%3E%3Cuse href='%23s' transform='scale(1.333) rotate(-60)'/%3E%3Cuse href='%23s' transform='scale(1.45) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(1.6) rotate(10)'/%3E%3C/g%3E%3C/defs%3E%3Cg transform='translate(1000 0)'%3E%3Cg transform='translate(0 225)'%3E%3Ccircle fill='url(%23a)' r='3000'/%3E%3Cg opacity='0.5'%3E%3Ccircle fill='url(%23a)' r='2000'/%3E%3Ccircle fill='url(%23a)' r='1800'/%3E%3Ccircle fill='url(%23a)' r='1700'/%3E%3Ccircle fill='url(%23a)' r='1651'/%3E%3Ccircle fill='url(%23a)' r='1450'/%3E%3Ccircle fill='url(%23a)' r='1250'/%3E%3Ccircle fill='url(%23a)' r='1175'/%3E%3Ccircle fill='url(%23a)' r='900'/%3E%3Ccircle fill='url(%23a)' r='750'/%3E%3Ccircle fill='url(%23a)' r='500'/%3E%3Ccircle fill='url(%23a)' r='380'/%3E%3Ccircle fill='url(%23a)' r='250'/%3E%3C/g%3E%3Cg transform='rotate(-118.8 0 0)'%3E%3Cuse href='%23g' transform='rotate(10)'/%3E%3Cuse href='%23g' transform='rotate(120)'/%3E%3Cuse href='%23g' transform='rotate(240)'/%3E%3C/g%3E%3Ccircle fill-opacity='0.58' fill='url(%23a)' r='3000'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-attachment: fixed;
background-size: cover; */
}

.home-about-contents{
    text-align: justify;
    padding-top:60px;
    font-weight: 600;
    font-size: 20px;
}

@media (max-width:991px) {
    .home-about-contents{
        padding-top: 20px;
    }
   
}


@media (max-width:576px) {
    .home-about-contents{
        font-size: 16px;
    }
   
}

/* ----------------------------------------------------------------------------------------------
Home Page How We Work Block 
------------------------------------------------------------------------------------------------- */
.home-how-we-work{
    transition: all .2s ease-in-out;
    z-index:1;

}

.home-how-we-work:hover{
    transform:scale(1.1);
}

.home-services{
    background-color: #345374;
    position: relative;
}

.home-services .section-title h3 {
    color: #ffffff;
    font-size: 35px;
    font-weight: 900 !important;
    margin-top: 3px;
    line-height: 1.2;
    margin-bottom: 5px;
}
.home-services .description{
    margin-bottom: 5px;
}

@media (max-width:500px) {
    .home-services .section-title h3 {
        font-size: 24px;
        font-weight: 500;;
    }
    .home-how-we-work{
        transition: none;
    }
    .home-how-we-work:hover{
        transform: none;
    }
}


.sp-color1 {
    color: #ffc221 !important;
}

.service-shape {
    position: absolute;
    top: 0;
    right: 0;
}


.service-shape img {
    max-width: 400px;
}

/* -------------------------------------------------------------------------------------------------------
Particular Seervice Page 
-------------------------------------------------------------------------------------------------------------- */
.particular-service h1{
    font-size: 48px;
    font-weight: 700;    
}

.particular-service p{
    font-size: 24px;
    font-weight: 500;
}



/* -----------------------------------------------------------------------------------------------------
Home Page Call us Section
-------------------------------------------------------------------------------------------------------- */
.call-us-area::before {
    content: '';
    position: absolute;
    opacity: 0.1;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/call-shap1.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.call-us-area {
    background-color: #345374;
    position: relative;
    z-index: 1;
}

.call-contact {
    padding: 50px 0;
}

.call-contact .call-btn {
    font-size: 35px;
    color: #ffffff;
    padding-bottom: 15px;
    font-weight: 600;
}
.call-contact h3 {
    font-size: 35px;
    color: #ffc221;
    margin-bottom: 5px;
    font-weight: 600;
}

.call-contact p {
    font-size: 20px;
    color: #ffffff;
    margin-bottom: 25px;
}

.btn-bg-two {
    background-color: #0071dc;
}

.default-btn {
    display: inline-block;
    padding: 12px 32px;
    color: #ffffff;
    text-align: center;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.border-radius-5 {
    border-radius: 5px;
}

.default-btn::before {
    content: "";
    position: absolute;
    z-index: -1;
    height: 100%;
    left: -36%;
    top: 0;
    -webkit-transform: skew(50deg);
    transform: skew(50deg);
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    width: 0;
}
.call-us-img {
    text-align: center;
    position: relative;
    z-index: 1;
}
.call-us-img img{
    max-width: 100%;
}
.call-shape .shape1 {
    position: absolute;
    top: 30px;
    left: 30px;
}
.call-shape .shape2 {
    position: absolute;
    top: 30px;
    right: -35px;
}

@media only screen and (max-width: 991px){
    .call-contact {
        text-align: center;
        padding: 50px 0 30px;
    }
    .call-contact h3 {
        font-size: 18px;
    }
    .call-contact .call-btn {
        font-size: 26px;
    }
    .call-contact p {
        font-size: 16px;
        margin-bottom: 20px;
    }
    .default-btn {
        padding: 8px 18px;
    }
}

/* --------------------------------------------------------------------------------------------------
Home Our Benefits Block
---------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------
# F.A.Q
--------------------------------------------------------------*/
.faq .faq-item {
    margin: 0px;
    padding: 0px;
}
  
  .faq .faq-item i {
    color: #8bc4ea;
    font-size: 24px;
    float: left;
    line-height: 0;
    padding: 13px 0 0 0;
    margin: 0;
  }
  
  .faq .faq-item h4 {
    font-size: 24px;
    width: 100%;
    line-height: 26px;
    font-weight: 800;
    margin: 0 auto;
    text-align: center;
    padding: 2px;
    font-family: "Poppins", sans-serif;
  }
  
  .faq .faq-item p {
    font-size: 15px;
    font-weight: 700;
  }

  .home-benefits{
    background-color: white;
    background-image: url(../img/boxed-bg.jpg);
  }

  @media (max-width:576px) {
      .home-benefits{
        background-image:linear-gradient(to bottom,white,white);
      }
  }

  /* -------- Mobile Phone ----------------- */
  .mobile-phone-div {
    height: 590px;
    width: 320px;
    border: 3px solid #555;
    box-shadow: 1px 1px 7px #222;
    background-color: #000;
    margin: 10px auto;
    border-radius: 20px;
    position: relative;
}

.benefits-image-div{
    width: 100%;
    margin: 0 auto;
}

.benefits-image-div h4{
    margin:auto 4px !important;
    display: inline;
    vertical-align: middle;
}
.benefits-image-div .benefits-image-icon{
    display: inline !important;
    transition: all .2s ease-in-out;
    cursor: pointer;
}
.benefits-image-div .benefits-image-icon:hover{
    transform:scale(1.05);
}

.benefits-image-icon{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin-top: 15px;
    margin-bottom: 25px;
    box-shadow: 1px 1px 1px 1px;
}


.benefit-contents{
    display: none;
    position: relative;
    animation:fading-in-up 1.2s 0.3s both;
}

.mobile-view-benefits{
    position: relative;
    animation:fading-in-up 1.2s 0.3s both;
}

.mobile-phone-header {
    height: 30px;
    text-align: center;
    margin-top: 10px;
}

.mobile-phone-header * {
    display: inline-block;
    margin: 3px;
}

.mobile-phone-sensor {
    height: 4px;
    width: 4px;
    border: 1.5px solid #eee;
    border-radius: 50%;
    margin: 0 auto;
}

.mobile-phone-speaker {
    height: 6px;
    width: 100px;
    border: 1.5px solid #eee;
    margin: 0 auto;
    border-radius: 10px;
}

.mobile-phone-camera {
    height: 10px;
    width: 10px;
    border: 1.5px solid #eee;
    border-radius: 50%;
    margin: 0 auto;
}

.mobile-phone-screen {
    border: 2px solid #777;
    height: 500px;
    margin: 0 10px;
    padding: 8px;
    border-radius: 4px;
    background: #FFF;
    overflow-y: scroll;
    position: relative;
}

/* width */
.mobile-phone-screen::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  .mobile-phone-screen::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  
  /* Handle */
  .mobile-phone-screen::-webkit-scrollbar-thumb {
    background: #888;
  }
  
  /* Handle on hover */
  .mobile-phone-screen::-webkit-scrollbar-thumb:hover {
    background: #555;
  }


.mobile-phone-footer {
    height: 35px;
    width: 35px;
    margin: 0 auto;
    margin-top: 3px;
    border-radius: 50%;
    border: 3px solid #888;
    box-shadow: 1px 1px 4px #999;
}

.mobile-phone-black {
    background: #fff;
}

.mobbile-phone-button {
    display: block;
    position: absolute;
    height: 30px;
    width: 2px;
    background: #345374;
    border: 1px solid #222;
}

.mobile-phone-up {
    left: -5px;
    top: 80px;
    border-right: none;
}

.mobile-phone-down {
    left: -5px;
    top: 120px;
    border-right: none;
}

.mobile-phone-power {
    right: -5px;
    top: 120px;
    border-left: none;
}

.mobile-view-benefits-div h4{
    text-align: center;
    color: #345374;
    font-weight: 800;
    font-size: 28px;
    text-shadow: .5px .5px #000;
}
.mobile-view-benefits-div p{
    font-size: medium;
    font-weight: bolder;
}
.mobile-view-benefits-div img{
    /* height: 300px; */
    /* width: auto; */
    /* height: auto; */
    /* width: 300px; */
    border-radius: 40px;
    margin: 0px auto;
}

@media (max-width:991px){
    .benefits-image-div .benefits-image-icon{
        display: block !important;
    }
    .benefits-image-div{
        text-align: center;
    }
}

.clicked-action{
    position: relative;
    animation: clicked-action 2s 0.3s both;
}

@-webkit-keyframes clicked-action{
    0% {
        transform: scale(0.9);
      }
      100% {
        transform: scale(   1.1);
      }
    }


@keyframes clicked-action {
    0% {
        transform: scale(0.9);
      }
      100% {
        transform: scale(1.1);
      }
}

@-webkit-keyframes fading-out-right{
    from{ right:0px; display: block; }
    to{ right: -50px; display: none; }
}

@keyframes fading-out-right {
    from{ right:0px; display: block; }
    to{ right:-50px; display: none; }
}

/* ---------------------------------------------------------------------------------------------------------
Home Page Testimonials
----------------------------------------------------------------------------------------------------------*/
#testimonials{
    background-image: url("../img/pat.png");
}   

.owl-carousel, .owl-carousel .owl-item {
    background-image: url("../img/pat.png");
    background-color: #f7fbfe;
}


/* ---------------------------------------------------------------------------------------------------------
 Requesting Quote Section 
 ----------------------------------------------------------------------------------------------------------- */
.request-quote-section{
    padding-bottom: 0px;
}

.request-quote{
    background-color: #345374;
    color: white; 
    padding: 20px;
    padding-bottom: 0px;
    border-radius: 50px;
}

.request-quote-heading{
    padding-left: 30px;
}

.request-quote .image-part img{
    padding-top:70px;
    z-index:2;
}

.contact-btn-div{
    animation: scaling-up-and-down-div 2s infinite;
}
@keyframes scaling-up-and-down-div {
    0%{
        transform: scale(1.0);
    }
    50%{
        transform: scale(1.05);
    }
    100%{
        transform: scale(1.0);
    }
}

.contact-btn-large{
    padding: 1.3rem 7rem;
    font: 2.4rem/3rem robotoregular,sans-serif;
    background: #345374;
    color: #fff;
    border-radius: 12px;
    margin: 1rem 0 0;
    display: inline-block;
    animation: sc duration timing-function delay iteration-count direction fill-mode;
}

.contact-btn-large:hover{
    color: white;
}



.request-quote-section .request-quote .grid-wrapper {
    max-width: 46em;
    max-height: 30em;
    /* width: 50%; */
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 1em;
  }

@-webkit-keyframes rotate-to-right {
    to {transform: rotate(0deg);}
  }
  

  @keyframes rotate-to-right {
    to {transform: rotate(0deg);}
  }
  .request-quote-section .request-quote .grid-wrapper .thing1,.request-quote-section .request-quote .grid-wrapper .thing2,.request-quote-section .request-quote .grid-wrapper .thing3,.request-quote-section .request-quote .grid-wrapper .thing4,.request-quote-section .request-quote .grid-wrapper .thing5{
      margin: 0;
  }
  .request-quote-section .request-quote .grid-wrapper .thing1 {
    text-transform: uppercase;
    grid-column: 1/span 11;
    grid-row: 1;
    align-self: end;
    font-size: 3rem;
  }
  .request-quote-section .request-quote .grid-wrapper .thing2 {
    font-size: 1.5em;
    grid-column: 2/span 7;
    grid-row: 2;
  }
  .request-quote-section .request-quote .grid-wrapper .thing3 {
    font-size: 2em;
    grid-column: 2;
    grid-row: 3/span 5;
    align-self: end;
    writing-mode: vertical-rl;
  }
  .request-quote-section .request-quote .grid-wrapper .thing4 {
    font-size: 1.5em;
    grid-column: 5/span 10;
    grid-row: 4/span 5;
    align-self: start;
    text-align: right;
  }
  .request-quote-section .request-quote .grid-wrapper .thing4 span {
    text-transform: uppercase;
    margin: 10px;
    display: flex;
    justify-content:flex-end;
    width: 100%;
  }
  .request-quote-section .request-quote .grid-wrapper .thing5 {
    font-size: 1em;
    grid-column: 8;
    grid-row: 3/span 2;
    justify-self: start;
    writing-mode: vertical-rl;
  }
  .request-quote-section .request-quote .grid-wrapper .red-bar1 {
    display: block;
    min-width: 3em;
    width: 100%;
    height: 100%;
    background-color: #abd2fa;
    grid-column: 1;
    grid-row: 2/span 6;
  }
  .request-quote-section .request-quote .grid-wrapper .red-bar2 {
    display: block;
    width: 100%;
    height: .5em;
    background-color: #abd2fa;
    grid-column: 5/span 10;
    grid-row: 7;
    align-self: end;
  }
  .request-quote-section .request-quote .grid-wrapper .red-circle {
    display: block;
    width: 13em;
    height: 13em;
    border-radius: 100%;
    background-color: #abd2fa;
    grid-column: 9/span 6;
    grid-row: 1/span 3;
    align-self: center;
  }
  
  @media (max-width:1200px) {
    .request-quote .image-part img{
        padding-top: 120px;
    }
      
  }



  @media (max-width: 1024px) {
    .request-quote-section .request-quote .grid-wrapper .red-circle {
      width: 10em;
      height: 10em;
    }
  }
  @media (max-width: 768px) {
    .request-quote-section .request-quote .grid-wrapper .thing1{
        font-size: 2em;
    }
    .request-quote-section .request-quote .grid-wrapper .thing2,.request-quote-section .request-quote .grid-wrapper .thing4{
        font-size: 1em;
    }
  }
  @media (max-width: 425px) {
    .request-quote-section .request-quote .grid-wrapper .red-bar1{
        min-width:1em;
    }
    .request-quote-section .request-quote .grid-wrapper .red-bar2 {
        display: none;
    }
  }
  @media (max-width: 370px) {
    .request-quote-section .request-quote .grid-wrapper .thing1{
        font-size: 1.5em;
        grid-column: 1/span 12;
        z-index: 2;
    }
    .request-quote-section .request-quote .grid-wrapper .red-circle{
        grid-column:6/span 9;
        z-index: 1;
    }
    .request-quote-section .request-quote .grid-wrapper .thing2{
        z-index: 2;
    }
  }

.requestproject{
    background: rgb(27, 160, 27) !important;
    /* margin: 0px auto !important; */
    color: #fff !important;
    font-weight: 900 !important;
    transition: all .2s ease-in-out;
    border: 2px solid darkgreen;
    animation: scaling-up-and-down-div 2s infinite;
}
.requestproject:hover{
    transform:scale(1.1);
}

@media (max-width:991px) {
    .request-quote-section{
        padding-bottom: 70px;
    }
    .request-quote{
        padding-bottom:20px;
    }
}

@media (max-length:440px) {
    .request-quote-heading{
        padding-left: 0px;
    }
}

.white{
    color:#345374;
}

/* ---------------------------------------------------------------------------------------------------------
Softwares Page 
------------------------------------------------------------------------------------------------------------ */
.software-hero-div {
    display: block;
}
/* ul#portfolio-tabs{
    border-bottom: 0.5px solid #345374;
} */

.softwares{
    padding-top: 0px;
}

.softwares .active{
    background-color: #345374 !important;
}

.softwares .nav .nav-item a{
    font-weight: 700;
}

.software-hero {
    background-color: #345374;
    /* background-image: linear-gradient(to bottom, white, rgb(211, 222, 230), #F7F7F3); */
    /* background-image: linear-gradient(to bottom,rgba(69, 101, 132, 1),rgba(69, 101, 132, 1),rgba(69, 101, 132),rgba(133, 58, 58, 1)); */
    height: 50%;

    /* Position and center the image to scale nicely on all screens */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.software-hero .software-headings {
    position: relative;
    animation: fading-in-down 1.4s .3s both;
}

.software-hero .software-headings h1 {
    color: #ffffff;
    text-shadow: 2px 2px 0px #345374;
}

.software-hero .software-hero-buttons {
    position: relative;
    animation: fading-in-bottom-left 1.2s .8s both;
    margin: 0px;
}

.software-hero .software-hero-buttons .software-hero-button {
    background-color: #C8DBFE;
    color: #345374;
    padding: 10px 30px;
    border-radius: 50px;
}

.software-hero .software-hero-buttons .software-hero-button:hover {
    background-color: #345374;
    color: #8bc4ea;
}

.software-hero .software-hero-image {
    position: relative;
    animation: fading-in-up 1s 0.3s both;
}


.software-hero-text {
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpath fill='%23c7d2e6' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23bac7e6' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23adbbe6' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23a0b0e6' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%2392a5e6' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%238298d2' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23728abe' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23637daa' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23547197' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23456484' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
}

.software-hero-text h1 {
    text-align: center;
    color: #261431; 
}

.software-hero-text h2 {
    text-align: center;
    color: #1b0629;
}

.software-hero-buttons {
    position: relative;
    animation: fading-in-bottom-left 1.2s .8s both;
    margin: 0 auto;
}

.software-hero-buttons .software-hero-button {
    background-color: #C8DBFE;
    color: #261431;
    font-family: "Raleway", sans-serif;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 30px;
    border-radius: 50px;
    transition: 0.5s;
}

.software-hero-buttons .software-hero-button:hover {
    background-color: #261431;
    color: #8bc4ea;
}

.software-display-box{
    margin-bottom: 60px;
}

.software-display-box .card{
    -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 15%);
    box-shadow: 0 0 15px rgb(0 0 0 / 15%);
}

.software-display-box .software-image,.software-display-box .software-iframe{
    border:none;
    border-bottom: 2px solid #345374;
    position: relative;
}

.software-display-box .software-preview-box{
    position: relative;
}

.software-overlay{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  /* transition:0.5s ease-in-out; */
  background-image:linear-gradient(to bottom,#34537477,#34537477);
}

.software-preview-box:hover .software-overlay{
  animation: fading-in-up 1s  0.2s both;
}

.software-preview-box .software-overlay-icon{
    font-size:30px;
    color:#345374;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    background-color: #fff;
}

.softwares-heading{
    color: #fff;;
    font-weight: 900;
    font-size: 300%;
    padding-right: 20px;
  }
  .softwares-heading:hover{
    color:#000;
  }
  
  .software-row{
    border-radius: 12px;
    padding: 5px;
    background-color:rgb(243, 240, 237);
    box-shadow: 1px 1px 1px 1px;
  }
  
  .soft-bg{
      /* The image used */
      background-image:linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)), url("../img/soft.jpg");
      background-position:inherit;
      background-repeat: no-repeat;
      background-size: cover;
        
      padding:90px 0px 20px 0px;
  }
  .soft-bg .justifying-button{
    justify-content: flex-end;
  }

  .soft-heading{
    color: #fff;
    font-weight: 900;
    font-size: 300%;
    margin:.50rem;
    padding-right: 20px;
  }

  .soft-contents h3{
      font-size: 20px;
      font-weight: 800;
  }

  .soft-contents .soft-features{
    padding-inline-start: 15px;
  }


  .soft-contents .soft-features li{
    -webkit-padding-start: 0.35em;
    padding-inline-start: 0.35em;
  }

  .soft-contents .soft-features li::marker{
    content: "⚙";
  }

  
  .soft-contents .soft-tech{
    padding-inline-start: 20px;
}


.soft-contents .soft-tech li{
    -webkit-padding-start: 0.35em;
    padding-inline-start: 0.35em;
}

.soft-contents .soft-tech li::marker{
    content: "👨‍💻";
}

  .soft-right .software-image,.soft-right .software-iframe{
    width: 100%;
    height: auto;
    -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 35%);
    box-shadow: 0 0 15px rgb(0 0 0 / 35%);
  }
  
  .software-iframe{
    overflow: scroll;
    height: 100%;
  }
  
  
  .btn-software{
    display: inline-block;
    padding: 16px;
    overflow: hidden;
    color: #345374;
    text-decoration: none;
    border: 1px solid #345374;
    border-radius: 3px;
    background-position: 0 -100%;
    background-repeat: repeat-x;
    transition: background-position 0.8s ease;
    font-weight:600;
  }

  .btn-software:hover{
    background-position: 100% 50%;
    border-color: #345374;
    color: #fff;
  }

  .btn-soft{
    display: inline-block;
    padding: 16px;
    overflow: hidden;
    color: #345374;
    text-decoration: none;
    border: 1px solid #345374;
    border-radius: 3px;
    background-color: #fff;
    background-position: 0 -100%;
    background-repeat: repeat-x;
    transition: background-position 0.8s ease;
    font-weight:600;
  }

  .btn-soft:hover{
    background-position: 100% 50%;
    border-color: #345374;
    color: #fff;
  }

  .btn-liquid-bg{
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCBtZWV0IiB2aWV3Qm94PSIwIDAgMjk5Ljg2IDEzNi4xOSIgd2lkdGg9IjI5OS44NiIgaGVpZ2h0PSIxMzYuMTkiPjxkZWZzPjxwYXRoIGQ9Ik0wLjUgMTM2LjNMMzAwLjM2IDEzNi4zQzMwMC4zNiA1OC44NSAzMDAuMzYgMTUuODIgMzAwLjM2IDcuMjFDMzAwLjM2IDcuMjEgMjkwLjQ1IDEyLjA3IDI3OC4xOSAxMi4wN0MyNjUuOTIgMTIuMDcgMjQ3LjAzIDAuMTEgMTk5LjgxIDAuMTFDMTUyLjU5IDAuMTEgMTI3LjY3IDkuNTEgMTAxLjQzIDkuNTFDNzUuMTkgOS41MSA1NS4xNiAwLjk2IDQxLjYzIDAuOTZDMjguMSAwLjk2IDAuNSA4Ljk2IDAuNSA4Ljk2QzAuNSAyNS45NCAwLjUgNjguMzkgMC41IDEzNi4zWiIgaWQ9ImQxb1JlOGpISngiPjwvcGF0aD48L2RlZnM+PGc+PGc+PGc+PHVzZSB4bGluazpocmVmPSIjZDFvUmU4akhKeCIgb3BhY2l0eT0iMSIgZmlsbD0iIzM0NTM3NCIgZmlsbC1vcGFjaXR5PSIxIj48L3VzZT48Zz48dXNlIHhsaW5rOmhyZWY9IiNkMW9SZThqSEp4IiBvcGFjaXR5PSIxIiBmaWxsLW9wYWNpdHk9IjAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2Utb3BhY2l0eT0iMCI+PC91c2U+PC9nPjwvZz48L2c+PC9nPjwvc3ZnPg==");
  }
@media (max-width:991px) {
    .software-hero-buttons .software-hero-button {
        font-weight: 700;
        font-size: 14px;
        padding: 8px 25px;
    }
}

@media (max-width:768px) {
    .soft-bg{
        padding-bottom: 48px;
    }
    .soft-bg .justifying-button{
        justify-content: flex-start;
    }
    .soft-heading{
        font-size: 200%;
    }
    .software-hero-buttons .software-hero-button {
        font-weight: 600;
        font-size: 12px;
        padding: 6px 20px;
    }
    .software-hero-text h1 {
        font-weight: 800;
        font-size: 20px;
    }
}



@-webkit-keyframes fading-out-up {
    from {top: 0px; opacity:1;}
    to {top:-50px; opacity:0;}
  }
  

  @keyframes fading-out-up {
    from {top: 0px; opacity:1;}
    to {top:-50px; opacity:0;}
  }

  /* -----------------------------------------------------------------------------------------------------
  Contact us Page 
  ------------------------------------------------------------------------------------------------------ */
.pt-45 {
    padding-top: 45px;
}

.contact-info {
    margin-bottom: 30px;
    background-color: #345374;
    padding: 52px 35px 22px;
    border-radius: 15px;
    position: relative;
    z-index: 1;
}

.mr-20 {
    margin-right: 20px;
}

.contact-info::before {
    content: '';
    position: absolute;
    opacity: 0.1;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/call-shap1.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.contact-info span {
    color: #ffc221;
    display: block;
    margin-bottom: 5px;
}

.contact-info h2 {
    color: #ffffff;
    font-size: 26px;
    margin-bottom: 15px;
}

.contact-info p {
    color: #ffffff;
    margin-bottom: 20px;
}

.contact-info ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.contact-info ul li {
    display: block;
    margin-bottom: 30px;
    padding-left: 60px;
    position: relative;
}

.contact-info ul li .content i {
    width: 45px;
    height: 45px;
    line-height: 45px;
    background-color: #ffffff;
    font-size: 20px;
    color: #0071dc;
    border-radius: 50px;
    border: 1px solid #E2E2E2;
    margin-bottom: 10px;
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
}

.contact-info ul li .content h3 {
    font-size: 18px;
    margin-bottom: 10px;
    color: #ffffff;
    display: block;
}

.contact-info ul li .content a {
    color: #ffffff;
    display: block;
    font-weight: 400;
    font-size: 15px;
}

.contact-info ul li .content span {
    color: #ffffff;
    font-weight: 400;
    display: block;
    font-size: 15px;
}

.contact-form {
    max-width: 800px;
    position: relative;
    z-index: 1;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
}

.contact-form .form-group {
    margin-bottom: 20px;
    position: relative;
}

.contact-form .form-group label {
    color: #252525;
    font-size: 15px;
    margin-bottom: 15px;
    font-weight: 500;
}

.contact-form .form-group .form-control {
    height: 50px;
    color: #252525;
    border: 1px solid #0071dc;
    background-color: #ffffff;
    font-size: 15px;
    padding: 10px 20px;
    width: 100%;
    border-radius: 0;
    font-weight: 500;
}

.contact-form .form-group textarea.form-control {
    height: auto;
}

.contact-form .with-errors {
    float: left;
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 0;
    color: #f00;
    font-weight: 400;
    display: block;
}

.contact-form .default-btn {
    border: 0;
    outline: none;
}

.btn-bg-two {
    background-color: #0071dc;
}

.border-radius-50 {
    border-radius: 50px;
}

/* -------------------------------------------------------------------------------------------------
All Blogs Lists 
------------------------------------------------------------------------------------------------------ */

.blog-bg {
    background-image: url('../img/blog.jpg');   
    background-position:center;
    background-size: cover; 
    /* height: 350px; */
    padding:150px 0px;
    margin-top: 60px;
  }
  
  
  .avatar {
    vertical-align: middle;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 8px;
  }
  
  
  
  .blog-list-item{
    background-color: whitesmoke;
    box-shadow: 1px 1px 1px 1px;
    border-radius: 12px;
  }

.blog-area{
    padding-top: 50px;
}

.blogs-heading{
    font-family: Roboto;
    font-size:7vw;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0em;
}
.sp-color2 {
    color: #0071dc;
}

.section-title h3 {
    font-size: 35px;
    font-weight: 600;
    margin-top: 0;
    line-height: 1.2;
    color: #252525;
    margin-bottom: 0;
}

.blog-card {
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 5%);
    box-shadow: 0 0 15px rgb(0 0 0 / 5%);
    margin-bottom: 30px;
    border-radius: 5px;
    -webkit-transition: 0.9s;
    transition: 0.9s;
    border: 1px solid #f1f1f1;
}

.blog-card .blog-img {
    position: relative;
}

.blog-card .blog-img img {
    border-radius: 5px;
}

.blog-card .blog-img .blog-tag {
    background-color: #ffc221;
    padding: 15px 12px;
    position: absolute;
    bottom: -20px;
    right: 30px;
    border-radius: 5px;
    text-align: center;
}

.blog-card .blog-img .blog-tag h3 {
    font-size: 17px;
    color: #ffffff;
    line-height: 1;
    margin-bottom: 0;
    font-weight: 500;
}

.blog-card .blog-img .blog-tag span {
    color: #ffffff;
    line-height: 1;
    font-weight: 500;
}

.blog-card .content {
    padding: 25px 30px;
}

.blog-card .content ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-card .content ul li {
    display: inline-block;
    font-size: 15px;
    margin-right: 20px;
}

.blog-card .content ul li a:last-child {
    margin-right: 0;
}

.blog-card .content ul li a {
    color: #444444;
}

.blog-card .content ul li a i {
    font-size: 20px;
    color: #0071dc;
    margin-right: 5px;
    position: relative;
    top: 3px;
}


.blog-card .content h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 22px;
}

.blog-card .content h3 a {
    color: #252525;
}

.blog-card .content p {
    margin-bottom: 8px;
}

.blog-card .content .read-btn {
    color: #0071dc;
    font-size: 15px;
    font-weight: 600;
}

.blog-card .content .read-btn i {
    font-size: 20px;
    position: relative;
    top: 5px;
}

@media (max-width:576px) {
    .blog-bg{
        background-position: left;
    }
}

/* ----------------------------------------------------------------------------------------------------------------------------
Particular Blog Page 
-------------------------------------------------------------------------------------------------------------------------------- */
.blog-details-area{
    outline:2px Solid #345374;
}

.blog-article {
    margin-bottom: 30px;
}

.blog-article .blog-article-img {
    margin-bottom: 30px;
    position: relative;
}

.blog-article .blog-article-img img {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;    
    border-radius: 15px;
    width: 100%;
}

.blog-article .blog-article-img .blog-article-tag {
    background-color: #ffc221;
    padding: 15px 12px;
    position: absolute;
    bottom: -20px;
    right: 30px;
    border-radius: 3px;
    text-align: center;
}

.blog-article .blog-article-img .blog-article-tag h3 {
    font-size: 17px;
    color: #ffffff;
    line-height: 1;
    margin-bottom: 0;
    font-weight: 500;
}

.blog-article .blog-article-img .blog-article-tag span {
    font-size: 17px;
    color: #ffffff;
    line-height: 1;
    font-weight: 500;
}

.blog-article .blog-article-title {
    margin-bottom: 20px;
}

.blog-article .blog-article-title ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-article .blog-article-title ul li {
    display: inline-block;
    font-size: 15px;
    color: #252525;
    margin-right: 30px;
    position: relative;
    font-weight: 500;
}


.blog-article .blog-article-title ul li i {
    font-size: 18px;
    margin-right: 10px;
    position: relative;
    top: 3px;
    color: #0071dc;
}


.blog-article .blog-article-title h2 {
    font-weight: 700;
    font-size:24px; 
    line-height:28px;
    width: 100%;
    float: left;
    padding-top: 30px;
    padding-bottom: 30px;
    position: relative;
    margin: 0 0 50px;
}
.blog-article .blog-article-title h2::after {
    left: 0;
    bottom: 0;
    height: 4px;
    content: '';
    width: 160px;
    border-radius: 2px;
    position: absolute;
    background-color: #3498db;
}

.blog-article .article-content {
    padding-bottom: 10px;
}

.blog-article .article-content .codes{
    margin-bottom: 20px;
    min-width:100%;
    height:120px;
}

.blog-article .article-content p {
    margin-bottom: 20px;
}

.blog-article .blog-article-share {
    padding: 10px 0;
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 30px;
}

.blog-article .blog-article-share .blog-tag ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.blog-article .blog-article-share .blog-tag ul li {
    display: inline-block;
    padding: 5px 3px;
    -webkit-transition: 0.7s;
    transition: 0.7s;
    color: #252525;
    font-weight: 400;
    margin-right: 5px;
}
.blog-article .blog-article-share .blog-tag ul li i {
    color: #0071dc;
    font-size: 18px;
    position: relative;
    top: 3px;
}


.blog-article .comments-wrap {
    margin-bottom: 30px;
}

.blog-article .comments-wrap .comment-title .title {
    font-size: 24px;
    margin-bottom: 0;
    color: #252525;
}

.blog-article .comments-wrap .comment-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-article .comments-wrap .comment-list li {
    position: relative;
    padding: 30px;
    padding-left: 75px;
    border-bottom: 1px solid #e1e1e1;
}

.blog-article .comments-wrap .comment-list li h3 {
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 600;
    color: #252525;
}

.blog-article .comments-wrap .comment-list li p {
    margin-top: 10px;
    margin-bottom: 0;
}

.blog-article .comments-form {
    margin-top: 30px;
    margin-bottom: 30px;
}

.blog-article .comments-form .title {
    font-size: 24px;
    margin-bottom: 20px;
    color: #252525;
}

.blog-article .comments-form .contact-form {
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    background-color: #ffffff;
}

.particular-blog-title{
    font-weight: 700;
    font-size:24px; 
    line-height:28px;
    width: 100%;
    float: left;
    padding-bottom: 30px;
    position: relative;
    margin: 0 0 50px;
}
.particular-blog-title::after{
    left: 0;
    bottom: 0;
    height: 4px;
    content: '';
    width: 160px;
    border-radius: 2px;
    position: absolute;
    background-color: #3498db;
}


.side-bar-area {
    margin-left: 15px;
}

.side-bar-widget {
    background-color: #ffffff;
    border-left: 0.5px solid #a9a9a9;
    padding-left: 10px;
}

.side-bar-widget .title {
    font-size: 20px;
    color: #252525;
    padding: 0;
    font-weight: 600;
    position: relative;
    display: inline-block;
    margin-bottom: 10px;
    background-color: transparent;
    width: 100%;
}

.side-bar-widget .widget-popular-post {
    position: relative;
    overflow: hidden;
    padding: 0;
    margin-top: 10px;
    margin-bottom: 20px;
}

.side-bar-widget .widget-popular-post .item {
    overflow: hidden;
    margin-bottom: 13px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E2E2E2;
}

.side-bar-widget .widget-popular-post .item .thumb {
    float: left;
    overflow: hidden;
    position: relative;
    margin-right: 15px;
}

.side-bar-widget .widget-popular-post .item .thumb .full-image {
    width: 80px;
    height: 80px;
    display: inline-block;
    background-size: cover !important;
    background-repeat: no-repeat;
    background-position: center center !important;
    position: relative;
    background-color: #070b3b;
}

.side-bar-widget .widget-popular-post .item .info {
    overflow: hidden;
    padding: 0;
}

.side-bar-widget .widget-popular-post .item .info .title-text {
    margin-bottom: 0;
    line-height: 1.15;
    font-size: 16px;
    font-weight: 500;
    max-width: 210px;
}

.side-bar-widget .widget-popular-post .item .info .title-text a {
    display: inline-block;
    color: #252525;
    margin-bottom: 5px;
}

.side-bar-widget .widget-popular-post .item .info p {
    font-size: 14px;
    line-height: 1.1;
    margin-bottom: 0;
    max-width: 180px;
    color: #345374;
}

nav#blog-links .nav-item .nav-link{
    color: #345374;
}


nav#blog-links .nav-item .nav-link:hover,
nav#blog-links .nav-item .nav-link:focus,
nav#blog-links .nav-item .nav-link:active{
    color: #fff;
    background-color: #345374;
}   

/* -----------------------------------------------------------------------------------------------------------------------
Hire Developers Page
--------------------------------------------------------------------------------------------------------------------------- */

.hire-bg {
    padding: 200px 0px;
    background-image: linear-gradient(to left, #0002,#0007, #0002), url("../img/hire-us.jpg");
    /* background-image: linear-gradient(to bottom, #F8FCFF, #F8FCFF, #F7F7F3); */
    background-attachment: fixed;
    /* background-position:center; */
    background-size: cover;
    height: 100vh;
}

.hire-intro {
    color: #ffc221;
    font-size: 48px;
    font-weight: 700;
}

.hire-constant{
    color: #fff;
    padding-bottom: 20px;
}

.hire-btn{
    display: inline-block;
    padding: 12px 32px;
    color: #ffffff;
    text-align: center;
    background-color:#345374;
    position: relative;
    border-radius: 50px;
    overflow: hidden;
    z-index: 1;
    font-weight: bold;
}
.hire-btn:hover{
    color: gainsboro;
    font-weight: bolder;
    border: 2px solid gainsboro;
}

.typing {
    position: relative;
    margin-left: 10px;
    color: #fff;
}

.typing::after {
    content: '';
    position: absolute;
    width: 1px;
    height:60px;
    border: 2px solid #fff;
    animation: blink 0.5s infinite ease;
}

@-webkit-keyframes blink {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes blink {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* -----------------------------------------------------------------------------------------------------------------------------
Training Page
--------------------------------------------------------------------------------------------------------------------------------- */
.training-bg{
    background-image:linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)), url("../img/training.jpg");
    background-position:top;
    background-repeat: no-repeat;
    background-size: cover;
    height: 460px;
    position: relative;
    padding-top: 70px;
}

.training-heading h1{
    font-size: 52px;
    line-height: 60px;
    text-shadow: 1px 1px 1px #000;
    color: #fff;
    padding-top: 30px;
}


.training-heading h3{
    font-size: 2rem;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    padding-top:40px;
}


.training-heading h3 .training-contact{
    color: #345374;
    animation: scaling-up-and-down 2s infinite ease-in-out;
}
@keyframes scaling-up-and-down {
    0%{
        font-size: 2.2rem;
    }
    50%{
        font-size: 2rem;
    }
    100%{
        font-size: 2.2rem;
    }
}


.training-form{
    box-shadow: 0px -1px 4px 1px #00000029;
    border-radius: 5px;
    background: linear-gradient(130deg, #07d9a3, #048fee) !important; 
    color: white !important;
}

.trainings-list .particular-training{
    padding: 5px;
    background-color: #fff;
    color: #345374;
}

.trainings-list .particular-training h2{
    font-size: 52px;
    font-weight: 900;
}

.trainings-list .particular-training:hover{
    background-color: #345374;
    color: #fff;
}

.trainings-list .particular-training .btn-training-selection{
    background-color: #fff;
    color: #345374;
    border: 1.2px solid #345374;
    margin: 12px;
    padding: 10px;
    display: inline-block;
    transition: all 0.5s ease-in-out;
}

.trainings-list .particular-training .btn-training-selection:hover{
    background-color: #000;
    color: #fff;
    border: 1px solid #fff;
}

.trainings-list .particular-training p::before{
    content: "\2192 ";
    display: inline-block;
    margin-right:10px;
}
.trainings-list .particular-training p{
    text-align: justify;
    margin: 2px;
}

.training-offers, .placement-guarantee, .why-this-course, .training-intro{
    padding: 50px 0px;
}

.training-offers .training-offers-div{
    background-color: #345374;
    margin: 12px auto;
    padding: 10px;
    transition: all 0.75s;
}

.training-offers .training-offers-div:hover{
    transform: scale(1.05);
}

.training-offers .training-offers-div h4{
    font-weight: 700;
    color: #fff;
}

.training-offers .training-offers-div p{
    color: #fff;
}


.training-form h2,.training-hero-form h2,.training-form-later h2 {
    font-size: 20px;    
    text-align: center;
    padding:10px;
}

.btn-training{
    display: inline-block;
    padding: 16px;
    overflow: hidden;
    color: #fff;
    text-decoration: none;
    border: 1px solid #345374;
    border-radius: 3px;
    transition: all 0.8s ease;
    font-weight:600;
    background-color: #345374;
}

.btn-training:hover{
    background-position: 100% 50%;
    background-color: #fff;
    border-color: #345374;
    color: #345374;
}



.train-bg{
    background-position:top;
    background-repeat: no-repeat;
    background-size: cover;
    height: 460px;
    position: relative;
    padding-top: 70px;
}

.training-wrap-up .list{
    padding-inline-start: 15px;
  }


  .training-wrap-up .list li{
    -webkit-padding-start: 0.35em;
    padding-inline-start: 0.35em;
  }

  .training-wrap-up .list li::marker{
    content: "\270E";
  }

.training-wrap-up blockquote {
	position: relative;
	margin: 10px 0px;
	padding: 1.6em 2.4em .7em;
	font: italic 1.2rem Vollkorn;
	background: hsl(0 0% 97%) no-repeat left /140px;
	border-radius: 7px;
	border: 2px solid white;
	box-shadow: 2px 2px 4px hsl(0 0% 0% / 20%);
	text-indent: 1.6em;
}

@media (min-width: 768px) {
	.training-wrap-up blockquote {
		margin: 15px 0px;
	}
}

.training-wrap-up blockquote::before {
	content: "";
	pointer-events: none;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	border-radius: 7px;
	box-shadow:
		inset -2px -2px 1px hsl(0 0% 100%),
		inset 2px 2px 4px hsl(0 0% 0% / 20%);
}

.training-wrap-up blockquote::after {
	content: "❝";
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -2px;
	transform: translate(-50%, -50%);
	width: 1.3em;
	height: 1.3em;
	background: white;
	box-shadow: 0 4px 5px -1px hsla(0 0% 0% / 20%);
	border-radius: 999px;
	display: grid;
	place-content: center;
	padding-top: .5em;
	color:  hsl(322deg 85% 65%);
	font-size: 36px;
	font-style: normal;
	text-indent: 0;
}

@media (min-width:1150px) {
    .training-bg{
        height: 650px;
        clip-path: circle(107.9% at 26% -74%);
    }
    .training-hero-form{
        position: absolute;
        right:2vw;
        top:94px;
        box-shadow: 0px -1px 4px 1px #00000029;
        border-radius: 5px;
        background: linear-gradient(130deg, #07d9a3, #048fee) !important; 
        color: white !important;
    }
}

@media (min-width:1330px) {
    .training-bg{
        height: 700px;
    }
    .training-hero-form{
        top: 150px;
    }
}

@media (max-width:1150px) {
    .training-bg:before,.training-bg:after{
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        right: 0;
        background-repeat: repeat-x;
    }
    .training-bg:before {
        height: 10px;
        background-size: 20px 20px;
        background-image: radial-gradient(circle at 10px -5px, transparent 12px, white 13px);
      }
      .training-bg:after {
        height: 15px;
        background-size: 40px 20px;
        background-image: radial-gradient(circle at 10px 15px, white 12px, transparent 13px);
      }
    .training-hero-form{
        position: absolute;
        right:2vw;
        top:94px;
        box-shadow: 0px -1px 4px 1px #00000029;
        border-radius: 5px;
        background: linear-gradient(130deg, #07d9a3, #048fee) !important; 
        color: white !important;
    }
}

@media (max-width:768px) {
    .training-bg{
        height: 400px;
        clip-path: circle(150% at 50% -29%);
    }
    .training-hero-form{
        display: none;
    }
    .trainings-list .row{
        padding: 40px 0px;
    }
}

@media (max-width:500px) {
    .training-bg{
        height: 600px;
    }
}

@media (max-width:400px) {
    .trainings-list .row .particular-training h2{
        font-size: 40px;
        font-weight: 800;
    }
    .training-heading h1{
        font-size:40px;
        line-height: 48px;    
    }
}




.hiring-process .hiring-steps{
    width: 100%;
    display: flex;
    justify-content: space-around;
}

.hiring-process .hiring-steps .step-div{
    text-align: center;
}

.hiring-process .hiring-steps .step-div::after{
    content: '\27F6';
    position: relative;
    top: -215px;
    left: 150px;
    font-size: 120%;
}

.hiring-process .hiring-steps .step-div:last-child::after{
    content: "";
}

@media (max-width:991px) {
    .hiring-process .hiring-steps .step-div::after{
        content: "";
    }
}

 
.hiring-process .hiring-steps .step{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    height: 150px;
    width: 150px;
    font-size: 60px;
    color: #000;
    position: relative;
}

.hiring-process .hiring-steps .steptxt{
    padding: 2rem;
    max-width: 90%;
    text-align: center;
}

.hiring-process .hiring-steps .step .check{
    position: absolute;
    top: 130px;
    font-size:25px;
}

.hiring-process .hiring-steps .step .check i{
    border-radius: 50%;
}


.hiring-process .hiring-steps .step.step-1{
    background-color: rgb(238, 156, 109);
}

.hiring-process .hiring-steps .step.step-1 .check i{
    background-color: rgb(238, 156, 109);
}


.hiring-process .hiring-steps .step.step-2{
    background-color: rgb(166, 235, 240);
}

.hiring-process .hiring-steps .step.step-2 .check i{
    background-color: rgb(166, 235, 240);
}


.hiring-process .hiring-steps .step.step-3{
    background-color: rgb(235, 191, 111);
}

.hiring-process .hiring-steps .step.step-3 .check i{
    background-color: rgb(235, 191, 111);
}


.hiring-process .hiring-steps .step.step-4{
    background-color: rgb(133, 204, 133);
}

.hiring-process .hiring-steps .step.step-4 .check i{
    background-color: rgb(133, 204, 133);
}



/* Service Particular Page */

/* Common Styling for Texts */
.service-page{
    font-size: 18px;
    line-height: 1.78;
    font-weight: 400;
}

@media (max-width:576px) {  
    .service-page{
        font-size: 16px;
        line-height: 1.5;
    }    
}

/* Particular Service Page -> Explore Section */
.service-page .service-explore-section{
    padding: 80px 0px;
}
.service-page .service-explore-section .section-title h3{
    /* Heading */
    padding-left: 40px; 
    padding-right:40px;
}
.service-page .service-explore-section .section-title h4{   
    /* Sub Heading */
    font-weight: 600;
    font-size:20px;
}
.service-page .service-explore-section .service-explore-section-media img{
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;    
}

/* Particular Service Page -> Service Lists Section */
.service-page .service-list-section{
    padding: 50px;
}
.service-page .service-list-section h2{
    font-weight: 700;
    font-size:24px; 
    line-height:28px;
    width: 100%;
    float: left;
    padding-bottom: 30px;
    position: relative;
    margin: 0 0 50px;
}
.service-page .service-list-section h2:after {
    left: 0;
    bottom: 0;
    height: 4px;
    content: '';
    width: 160px;
    border-radius: 2px;
    position: absolute;
    background-color: #3498db;
}
.service-page .service-list-section .service-list-items{
    font-size: 18px;
    font-weight: 400;
    line-height: 1.78;
}

/* Particular Service Page -> Service Box Section */
.service-page .service-box-section{
    padding: 60px 0;
    background: #f0f0f0;
}
.service-page .service-box-section .heading-section h3{
    font-size: 26px;
    margin-top: 0;
    line-height: 1.4; 
    font-weight:800; 
    text-align:center;
}
.service-page .service-box-section .service-box-inner{
    margin: 20px 0;
}
.service-page .service-box-section .service-box-inner .media{
    height: 100%;
    padding: 30px 20px;
    border-radius: 10px;
    background-color: #fff;
}
.service-page .service-box-section .service-box-inner .media .service-box-images{
    height:100px;
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:10px auto;
}


.sitemap-bg {
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("../img/sitemap.jpg");
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    height: 600px;
    position: relative;
    padding-top: 70px;
}

@media (min-width:1150px) {

    .sitemap-bg:before,
    .sitemap-bg:after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        right: 0;
        background-repeat: repeat-x;
    }

    .sitemap-bg:before {
        height: 10px;
        background-size: 20px 20px;
        background-image: radial-gradient(circle at 10px -5px, transparent 12px, white 13px);
    }

    .sitemap-bg:after {
        height: 15px;
        background-size: 40px 20px;
        background-image: radial-gradient(circle at 10px 15px, white 12px, transparent 13px);
    }
}

@media (max-width:768px) {
    .sitemap-bg {
        height: 400px;
        clip-path: circle(150% at 50% -29%);
    }
}

@media (max-width:500px) {
    .sitemap-bg {
        height: 600px;
    }
}

.elementor-4421 .elementor-element.elementor-element-e31dd89 {
    padding: 20px 0px 20px 0px;
}

.elementor-section {
    position: relative;
}

.elementor *,
.elementor :after,
.elementor :before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.elementor-section.elementor-section-boxed>.elementor-container {
    max-width: 1140px;
}

.elementor-section .elementor-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    position: relative;
}

.elementor-widget {
    position: relative;
}

.elementor-row {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.elementor-column,
.elementor-column-wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.elementor-column {
    min-height: 1px;
}

.elementor-column-gap-default>.elementor-row>.elementor-column>.elementor-element-populated {
    padding: 10px;
}

.elementor-column-wrap {
    width: 100%;
}

.elementor:not(.elementor-bc-flex-widget) .elementor-widget-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.elementor-widget-wrap {
    position: relative;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-line-pack: start;
    align-content: flex-start;
}

.elementor-widget-wrap>.elementor-element {
    width: 100%;
}

.elementor-widget-text-editor {
    color: #7A7A7A;
    font-family: Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 400;
}

.elementor-element .elementor-widget-container {
    -webkit-transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
    transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
    -o-transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
}

.c_site_map .sitemap-menu {
    border: 1px solid #eee;
    border-bottom: 1px solid #ff9111 !important;
    padding: 11px;
    border-radius: 5px;
}

.c_site_map .sitemap-menu h2 {
    font-size: 20px;
    font-weight: normal;
    margin-bottom: 21px;
    padding-top: 11px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: block;
    text-align: left;
    width: 100%;
}

.c_site_map .sitemap-menu h2 .sitemap-span {
    border-bottom: 3px solid #283953;
    display: inline-block;
    max-width: 80%;
    padding-bottom: 5px;
    position: relative;
    top: 2px;
}

.c_site_map .sitemap-menu h2 .sitemap-span strong {
    color: #345374;
}

.c_site_map .sitemap-menu .site-map-top {
    padding: 5px 0 1px 42px;
    text-align: left;
}

.elementor a {
    -webkit-box-shadow: none;
    box-shadow: none;
    text-decoration: none;
}

.elementor img {
    height: auto;
    max-width: 100%;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.c_site_map .sitemap-menu .wsp-pages-title,
.c_site_map .sitemap-menu .wsp-posts-title {
    display: none;
}

.c_site_map .sitemap-menu ul {
    margin: 0;
    padding-left: 33px;
    list-style: none;
}

.c_site_map .sitemap-menu ul li {
    background: url(assets/img/sitemapHorizontalLine.png) no-repeat scroll left 19px transparent;
    border-left: 1px solid #ddd;
    margin: 0 0 0 22px;
    padding: 9px 0 0 33px;
    text-align: left;
}

.c_site_map .sitemap-menu ul li a {
    color: #333;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.5s linear;
}

.elementor-clearfix:after {
    content: "";
    display: block;
    clear: both;
    width: 0;
    height: 0;
}

@media (min-width: 768px) {

    .elementor-column.elementor-col-100,
    .elementor-column[data-col="100"] {
        width: 100%;
    }
}