.mobile{
    padding-top: 5%;
}

.mobileHead{
    color: #222;
}
.navIconColor{
    color: #F9C327;
}
.g-content {
    min-height: 300px;
    max-width: 360px;
    padding: 15px;
    box-shadow: 0 0 4px rgba(0,0,0,.15);
}
.g-block-icons {
    font-size: 8rem;
    color: #F9C327;
    opacity: .6;
}
.blocks{
font-size: 18px;
color: #222;
font-weight: 400;
}
section#whatWeDoSection {
    padding: 20px 10px;
}
.appContact{
    display: inline-block;
     background-color:#545962;
     text-align:center;
     padding-top:70px;
     padding-bottom:70px;   
      box-sizing: inherit;width: 100%;
}
.btn-primary:hover {
    background:#F9C327 !important;
}
.zoom {
     /* padding: 50px;     */
    transition: transform .2s;
    width: 400px;
    height: 400px;
    margin: 0 auto;
}

.zoom:hover {
    -ms-transform: scale(1.2); 
    -webkit-transform: scale(1.2); 
    transform: scale(1.2); 
}
.mobileData{
    font-size: 20px;
}
.h3 .focusList{
     color:#222;
    }
    .carImg{
       width: 550px;
       height: 250px;
    }  
      
      .g-block:hover{
        -ms-transform: scale(1.1); 
        -webkit-transform: scale(1.1); 
        transform: scale(1.1);   
    }
    .swiperBody{
      background: #E3F2FD;
      font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
      font-size: 14px;
      color:#000;
      margin: 0;
      padding: 0;
    }
    .swiper-container {
        width: 100%;
        padding-top: 50px;
        padding-bottom: 50px;
      }
      .swiper-slide {
        background-position: center;
        background-size: cover;
        width: 300px;
        height: 300px;
      }
      .rasiMobileApp {
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
         /* margin-top: 3%; */
        background-image: url("/assets/img/grid-725270.jpeg");
    }
    .mobileAppTabs{
        margin-top: 25%;
    }
    .mobileAppTabs .nav-tabs>li>a {
        margin: 0;
        line-height: 50px;
        font-size: 1.6rem;
        border: 0;
        background-color: #fff;
    }
    
    .nav>li>a {
        position: relative;
        display: block;
        padding: 10px 15px;
        border-radius: 10px;
    }
        
    .mobileAppTabs .nav-tabs>li.active>a, .mobileAppTabs .nav-tabs>li.active>a:hover, .mobileAppTabs .nav-tabs>li.active>a:focus, .mobileAppTabs .nav-tabs>li>a:hover {
        background-color: #fab903;
        color: #fff;
        border: 0;
    }
    .rasi_secApp {
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
         /* margin-top: 3%; */
        background-image: url("/assets/img/portfolio_bg.jpg");
    }
    .mobileAppTabs .nav-tabs>li {
        margin: 0 0 10px;
        width: 32%;
        text-align: center;
        border: 0;
         /* border-radius: 10px; */
    }
    .mobileAppTabs .nav-tabs>li:nth-child(2n-1) {
        margin: 0 2% 10px;
    }
    .mobileAppTabs .nav-tabs {
        border-bottom: none !important;
    }
    .mobileNav{
        background: #1D1F20 !important;
    }
    .mobileHead{
        margin-top: 30px !important;
    }
    .menu-top li a.navItem{
        color:#222 !important;
    }
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 10px;
        left: 50%;
        width: 100%;
    }
    .techImg{
        margin-bottom: 3%;
         /* margin-left: 2em; */
    }

    @media screen and (max-width: 320px)  {
        .resTechImg{
            margin-left: 11%;
        }
    }
    @media screen and (max-width: 1200px) and (min-width: 990px) {
        .resTechImg{
            margin-right: -4em !important;
        }
    }
    @media screen and (max-width: 750px) and (min-width: 320px) {
        .mobileAppTabs .nav-tabs > li > a{
            line-height: 11px;
            font-size: 9px;
        }
    }
    @media screen and (max-width: 1024px) and (min-width: 750px) {
        .mobileAppTabs .nav-tabs > li > a{
            line-height: 15px;
            font-size: 15px;
        }
    }
    @media screen and (max-width: 990px) and (min-width: 750px) {
       .resGContent{
         padding: 0em 10em;
       }
    }

    .swiper-container {
        width: 100%;
        height: auto !important;
        padding-top: 50px;
        padding-bottom: 50px;
      }
      .swiper-slide {
        background-position: center;
        background-size: cover;
        width: 300px;
        height: 200px;
      }
        
      
    .swiperGrid{
        margin-left: 0em;
        width: 600px !important;
        height: 600px !important;
    }
    
    @media screen and (max-width: 425px) and (min-width: 320px) {
        .swiperGrid{
            width: 90% !important;
            height: 100% !important;
        }
        
    }
    @media screen and (max-width: 780px) and (min-width: 650px) {
    .inHouseTabs {
        margin-top: 0%; 
    }
    }
    
    @media screen and (max-width: 1999px) and (min-width: 990px) {
        .swiperGrid{
            margin-left: -4em;
        }
    }
    #resOverFlow{
        overflow-x: hidden;
    }
    .mobileAppTabs .nav-tabs > li > a {
        margin: 0;
        line-height: 23px;
        font-size: 15px;
        border: 0;
        background-color: #fff;
    }


    #title h1 {
        transform: translateZ(.25px) scale(.75);
        transform-origin: 50% 100%;
       
       }
       .fourGrid
   {
       width: 100%;
   }
       .slide.header{
           padding: 13vh 12%;
       }
       
       .socialservice{
         text-align: right;
         /* font-size: 48px !important;
           font-weight: 300; */
           line-height: 1.2;
           letter-spacing: 0;
           /* margin-bottom: 5.4rem; */
           color: #fff;
           text-align: center;
           margin-bottom: 0.4rem!important;
       }
       .socialcontent{
           padding-top: 30px;
           padding-bottom: 0;
           background-color: #fff;
       }
       .column-text {
         font-size: 31px;
           font-weight: 300;
           /* line-height: 1.2; */
           letter-spacing: 0;
           color: #5944B0;
       }
       .socialimg{
           display: block;
           margin-left: auto;
           margin-right: auto;
           width: 100%;
           margin-top: 289px;
       }
       .header_area.animated
   {
       background: #000 !important;
   
   }
   #ServicePageIDFirst svg:not(:root)
   {
       max-height: 370px;
       background-color: #000 !important;
   }
   #ServicePageIDSecond svg:not(:root)
   {
       max-height: inherit;
   
   }
   .WebDevelopmentHead
   {
     color: #fff !important;
     font-size: 22px;
       font-weight: 700;
       margin-top: 18px!important;
   }
   
   .serviceheader
   {
       position: absolute;
       top: 0;
       right: 0;
       font-size: 7pc;
       left: 0;
       bottom: 0;
       display: flex;
   }
   .customSvgSidebar
   {
       width: 42%;
       top: 33vw;
       z-index: 1;
       max-width: 640px;
       right: 0;
       position: absolute;
       pointer-events: none;
   }
   .customSvgSidebar svg:not(:root)
   {
       max-height: inherit !important;
   }
   .Section1Tab
   {
     display: flex;
       flex-wrap: wrap;
       align-items: flex-start;
       align-content: center;
   }
   .ImgAlignSecond
   {
     /* max-width: 370px; */
       margin-left: 23px !important;
   }
   .ImgAlignSecond
   {
     left: 0;
   }
   .com {
     position: relative;
    }
 
   .CustomClsNewDivWidget
   {
     background: #fff !important;
     min-height:511px;
   }
   @media (max-width: 660px)
   {
    ul.com__nav-list.menu--flexslider {
    flex-wrap:  wrap !important;
      border: 3px solid #f5f5f1;
  }
  
   }
   @media (max-width: 991px)
{
 
  .com__nav {
    position: relative !important;
    top: 0 !important;
}
.Sec4Img,.Sec4Text,.Sec3Text,.Sec3Img,.Sec2Text,.Sec2Img,.SecOneText,.SecOneImg
{
max-width: 100% !important;
}
.section1 div.d-flex,
.section2 div.d-flex,
.section3 div.d-flex,
.section4 div.d-flex
{
display: block !important;
}

a.com__nav-link
{
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 11px !important;
    padding: 7px 10px 7px 10px !important;
}
.com__nav-link b
{
  display: none;
}
.com__nav-item.active a .menu__icon div {
  display: block;
  margin: 7px auto;
  position: relative;
}
.menu__icon {
  z-index: 4 !important;
  height: auto !important;
  left: 0 !important;
  margin: 0 0 0 6px !important;
  position: relative !important;
  top: 0 !important;
  width: auto !important;
}
}   
          @media screen and (max-width: 1249px) and (min-width: 992px)
          {
            .typingMobileUserClsTittle
            {
              text-align: center;
              padding-top: 2em !important ;
              font-family: 'Glegoo', serif;
              font-weight: 700;
            }
            .com__section
            {
              padding: 0% !important;
            }
          }
          @media (min-width:1250px)
{
  .com__section {
  
    padding: 0 10%;

  }
}   
.com__section {
  flex-flow: column wrap;
  justify-content: center;
  min-height: 516px;  
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
   .com__section.active {
     opacity: 1;
     visibility: visible;
     z-index: 2;
   }
   .com__section-half {
     flex: 1;
     /* height: 100vh;
     display: flex; */
     flex-flow: column wrap;
     justify-content: center;
   }
   .com__section--text h1 {
     font-size: 33px;
     /* margin-bottom: 3vh;
     font-size: 48px;
     font-weight: 300; */
     color: #fff;
   }
   .com__section--text p {
     margin: 0;
     color: #fff !important;
     line-height: 1.3;
     font-size: 16px ;
   }
   .com__section--text img {
     /* max-width: 250px; */
     margin: 0 auto;
   }
   .com__section--text.centered {
     text-align: center;
   }
   /* .com__section--text-img {
     display: flex;
   
   } */
   .com__nav {
     width: 100%;
     position: absolute;
       z-index: 2;
   
       top: 436px;}
   /* .com__nav-list {
     padding-top: 28%;
   } */
   .com__nav-item {
     display: inline-block;
     background: #000;
       /* width: 16.4%;  */
     background: #000;
     transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
   }
   .com__nav-item.active {
     background: #20232a;
   }
   .com__nav-item:last-child {
     border-bottom: none;
   }
   ul.com__nav-list.menu--flexslider
   {
     display: flex ;
     border: 3px solid #f5f5f1;
   }
   .com__nav-item:hover {
    background: #000;
   }
   .com__nav-item:hover .com__nav-link {
     -webkit-transform: scaleX(1);
             transform: scaleX(1);
   }
   .com__nav-item:hover .blue-line,
   .com__nav-item:hover .white-line,
   .com__nav-item:hover .white-circle {
     -webkit-transform: none;
             transform: none;
     opacity: 1;
   }
   .menu__icon
   {
   z-index: 4;
     height: 36px;
       left: 50%;
       margin: 0 0 0 -18px;
       position: absolute;
       top: -19px;
       width: 36px;
   }
   a.com__nav-link:hover
   {
     background: #f5f5f1;
       color: #161616;
   }
   a.com__nav-link {
     background: none;
       color: #f5f5f1;
       display: block;
       font-size: 17px;
       font-size: 0.85rem;
       font-weight: 600;
       letter-spacing: .2em;
       padding: 2em .5em;
       position: relative;
       text-align: center;
       text-transform: uppercase;
     }
   .com__nav-item.active a
   {
     background: #f5f5f1;
     color: #000;
     box-shadow: inset 0px 0px 16px #000;
   }
   .com__nav-item.active a
   .menu__icon div {
       display: block;
       margin: 7px auto;
       position: relative;
   }
   .com__nav-item a:hover svg {
       fill: #f99e41;
   }
   .com__nav-item.active a svg {
       fill: #6bc05e;
       margin: 0px;
   }
   .com__nav-item a svg {
       fill: gray;
       margin-top: 7px;
   }
   .menu__icon b {
     background: #161616;
       border: 3px solid #f5f5f1;
       height: 36px;
       left: 0;
       position: absolute;
       top: 0;
       -ms-transform: rotate(45deg);
       -webkit-transform: rotate(45deg);
       transform: rotate(45deg);
       width: 36px;
   }
   .com__nav-link b {
     box-shadow: 0px 0px 10px #000;
     background: #000;
       border: 3px solid #f99e41;
       height: 36px;
       left: 0;
       position: absolute;
       top: 0;
       -ms-transform: rotate(45deg);
       -webkit-transform: rotate(45deg);
       transform: rotate(45deg);
       width: 36px;
   }
   .com__nav-list
   {
   
       -webkit-transform: translate3d(0, 0, 0);
       transform: translate3d(0, 0, 0);
     }
   .com__nav-link.flex-row {
     flex-flow: row wrap;
   }
   .com__nav-link.centered {
     align-items: center;
   }
   .com__nav-link .com__section-half {
     height: auto;
   }
   .com__nav-link .com__section-half:nth-child(2) {
     align-items: center;
   }
   
   .blue-line {
     display: block;
     width: 80%;
     height: 14px;
     background: #22E2ED;
     margin-bottom: 12px;
   }
   
   .white-line {
     display: block;
     width: 60%;
     height: 5px;
     background: rgba(255, 255, 255, 0.9);
     margin-bottom: 7px;
   }
   .white-line:nth-of-type(3) {
     width: 50%;
   }
   
   .white-circle {
     display: block;
     width: 30px;
     height: 30px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.9);
   }
   
   /* animation classes */
   .animate {
     transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
   }
   
   .slideInLeft {
     -webkit-transform: translate3d(-100%, 0, 0);
             transform: translate3d(-100%, 0, 0);
     opacity: 0;
   }
   
   .slideInRight {
     -webkit-transform: translate3d(100%, 0, 0);
             transform: translate3d(100%, 0, 0);
     opacity: 0;
   }
   
   .scaleIn {
     -webkit-transform: scale(0);
             transform: scale(0);
   }
   
   .scaleInLeft {
     -webkit-transform: scaleX(0);
             transform: scaleX(0);
     -webkit-transform-origin: left center;
             transform-origin: left center;
   }
   
   .delay-1 {
     transition-delay: 0.05s;
   }
   
   .delay-2 {
     transition-delay: 0.1s;
   }
   
   .delay-3 {
     transition-delay: 0.15s;
   }
   
   .delay-4 {
     transition-delay: 0.2s;
   }
   
   .delay-5 {
     transition-delay: 0.25s;
   }
   
   .logo {
     position: fixed;
     bottom: 3vh;
     left: 3vw;
     z-index: 2;
   }
   .logo img {
     width: 45px;
     transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
     -webkit-transform: rotate(0);
             transform: rotate(0);
   }
   .logo img:hover {
     -webkit-transform: rotate(180deg) scale(1.1);
             transform: rotate(180deg) scale(1.1);
   }
   #serviceContent{ min-height: 350px;     margin-top: 0px;}
  
   
     *[hidden] {
       display: none;
     }
   
     #canvas-container {
      overflow-x: auto;
      overflow-y: visible;
      position: relative;
      margin-top: -8px;
      margin-bottom: -20px;
      width: 50%;
      height:57%;
      overflow: hidden;
      display: block;
      margin-left: auto;
      margin-right: auto;
  
    }

     .canvas {
       display: block;
       position: relative;
       overflow: hidden;
     }
   
     .canvas.hide {
       display: none;
     }
   
     #html-canvas > span {
       transition: text-shadow 1s ease, opacity 1s ease;
       -webkit-transition: text-shadow 1s ease, opacity 1s ease;
       -ms-transition: text-shadow 1s ease, opacity 1s ease;
     }
   
     #html-canvas > span:hover {
       text-shadow: 0 0 10px, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
       opacity: 0.5;
     }
   
     #box {
       pointer-events: none;
       position: absolute;
       /* box-shadow: 0 0 200px 200px rgba(255, 255, 255, 0.5); */
       /* border-radius: 50px; */
       cursor: pointer;
     }
   
     textarea {
       height: 20em;
     }
     #config-option {
       font-family: monospace;
     }
     select { width: 100%; }
   
     #loading {
       animation: blink 2s infinite;
       -webkit-animation: blink 2s infinite;
     }
     @-webkit-keyframes blink {
       0% { opacity: 1; }
       100% { opacity: 0; }
     }
     @keyframes blink {
       0% { opacity: 1; }
       100% { opacity: 0; }
     }
     .service-paratittle{
      font-size: 16px ;
      font-family: 'Titillium Web', sans-serif!important;
      margin-top: 10px !important;
      color: #131212 !important;
    }

    .service-paratittles{
      font-family: 'Titillium Web', sans-serif!important;
      font-size: 18px;
      margin-top: 10px !important
    }
    .fa-arrow-left:before {
      position: absolute;
      height: 50px;
      width: 100px;
      color: #6cc15f;
      top: 113px;
      left: 24px;
      z-index: 9;
      background: rgb(0, 0, 0);
      height: 30px;
      width: 41px;
      padding-top: 5px;
      border: 1px solid #f89d46;
      border-radius: 88px;
      text-align: center;
      position: fixed;

  }


  .service-tittles{
    display: block;
      font-weight: 600;
      line-height: 1;
      margin-bottom: .5em;
      text-transform: uppercase;
      color: #f5f5f1;
      font-family: 'Glegoo', serif;
      font-size: 2rem;
      margin: 17px;
      text-transform: uppercase;
  }
  
  
  .client-name{
    font-family: 'Merienda', cursive!important;
  }
  .mobilesec1
  {
    min-height: auto;
    height: 100%;
    background: #000 !important;
  }

  .custom-class{
    margin: 9.125rem 0 0 !important;
    position: fixed !important;
    top:0!important;
  }
 
  @media screen and (max-width: 991px) and (min-width: 768px)
   {
    .typingMobileUserClsTittle
    {
      text-align: center;
      padding-top: 2em !important ;
      font-family: 'Glegoo', serif;
      font-weight: 700;
    }
    #serviceContent
    {
      min-height: 266px !important;
      margin-bottom: 16%;
    }
    .customClsHeadSize
{
  font-size: 18px !important;
}
    }
    @media (max-width:767px)
    {
      .service-paratittlemob
      {
        font-size: 13px !important;
      }
      .typingMobileUserClsTittle
      {
        padding-top: 2.5em !important ;
        font-size:25px !important;
        font-family: 'Glegoo', serif;
        font-weight: 700;
      }
      .customClsHeadSize
      {
        font-size: 15px !important;
      }
.Sec4Img,
.Sec3Img,
.Sec2Img,
.SecOneImg
{
display: none !important;
}
.com__section
{
  min-height: 260px !important;
  display: flex;
  justify-content: flex-end !important;
}
.CustomClsNewDivWidget
{
  min-height: auto !important;
}
.Section1Tab
{
  margin-bottom: 10px;
}
.com__section--text h1
{
  font-size: 19px;
}
#serviceContent
{
  min-height: 266px !important;
}
.Sec2Text,.Sec4Text
{
  margin-top: 70px;
}
.SecOneText
{
  margin-bottom: 30px;
}
    }
    @media (max-width: 660px)
{
  .Section1Tab
  {
    margin-top: 124px;
  }
  .fourGrid
  {
    width: 50% !important;
  }
  
}
@media screen and (max-width: 660px) and (min-width: 425px)
{
  .showMobile
  {
    margin-top: 17% !important;
  }
  .com__section--text p
  {
    font-size: 13px !important;
  }
}
@media (max-width: 424px)
{
  .showMobile
  {
    margin-top: 25% !important;
  }
}
@media only screen and (max-width: 425px) and (min-width: 375px)
{
   
    .sectiosifstClsmob,.sectiosifstClsmob.extracolor {
      font-size: 17px !important;
      margin-top: 20px !important;
      margin-bottom: 10px;
    }
    .com__section--text p
    {
      font-size: 13px !important;
    }
  }
 
.sectiosifstClsmob
{
  font-size: 27px !important;
  color: #ff9b3b !important;
  margin-top: 46px !important;
}
@media only screen and (max-width: 360px) and (min-width: 320px)
   {
    .com__section--text p
    {
      font-size: 13px !important;
    }
    .sectiosifstClsmob {
      font-size: 22px !important;
      
    }
  }
  .sectiosifstClsmob,.sectiosifstClsmob.extracolor {
    font-size: 22px !important;
    margin-top: 20px !important;
  }
  .service-paratittlemob
  {
    font-family: 'Titillium Web', sans-serif!important;
    font-size: 16px;
    line-height: 1.5;
    margin-top: 10px !important;
  }
  .typingMobileUserClsTittle
  {
    padding-top: 10%;
    font-family: 'Glegoo', serif;
    font-weight: 700;
  }